Font Awesome Background color

Question

When using the brilliant Font Awesome, how can I make the icons not transparent - for instance if I want to use http://fortawesome.github.io/Font-Awesome/icon/chevron-circle

Answer 1

The most simple solution i found was to just use the background with radial-gradient. HTML:

CSS:

.fa{
    color: red; 
    background: radial-gradient(grey 50%, transparent 50%);
}

You can just change out the colors you desire, or selectors but this will prevent the background color from going over circle arrows or anything similar.

Hope this helps someone, as some of the other answers would not scale well.