Change color of SVG sprite

Question

I am using SVG sprite as my background image:

.naar-logo {
    background: url(images/salt_sprite.svg) no-repeat -8px -78px;
    width: 36px;
    height: 49px;
    position: relative;
    top: 38px;
}
<div class="naar-logo"></div>

Color of sprite images is black, but I want it to be white. I tried with:

background: url(images/salt_sprite.svg) no-repeat white -8px -78px;

and color: white; on .naar-logo clas, but it not work. How can I change color of svg sprite to be white?

Possible duplicate of [I can't change the fill color of a SVG Sprite](https://stackoverflow.com/questions/31971550/i-cant-change-the-fill-color-of-a-svg-sprite) — Fred Gandt, Jul 13 '17 at 02:00

score 5 · Accepted Answer · answered Jul 13 '17 at 02:06

5

You cannot change the color with an external css. You need to inline the SVG in order to to that. Please read Using SVG for details.

answered Jul 13 '17 at 02:06

itacode

3,721
3
21
23

Change color of SVG sprite

1 Answers1