Home > Enterprise >  How to change the style color of svg via css
How to change the style color of svg via css

Time:07-23

I am currently building my first website and wanted to implement some svg's. I downloaded some and changed them up a bit with inkscape. The color for the svg is saved like this:

<path
     d="M 44.00,166.00 ..."
     style="fill:#000000;" />

is there a way to change the color with css. For example if i hover over it it changes the color?

Thanks for any help in advance

CodePudding user response:

You probably have it surrounded with <svg> so it would be something like:

<svg class='icon' [...]>
   <path d="M 44.00,166.00 ..."
     style="fill:#000000;" />
</svg>

Then you can change it with:

.icon path {
  fill: red;
}

Notice that it's not the SVG that gets fill but path inside the SVG element.

  • Related