'How to fill an SVG with HTML/CSS?

I've got this SVG, it is blue however I would like it to be black, and for the outer ring to be blue and the sword to be blue, keeping the text white.

This is my CSS code

path {
    fill:#429bfb;
  }
htmlcsssvg


Solution 1:[1]

This is a sample of an svg img. you can change the color of an svg by changing it inside the file or call it on css like this.

svg {
fill: black;
}
<svg fill="blue" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 16 16" width="64px" height="64px"><path d="M 4.5 2 C 3.675781 2 3 2.675781 3 3.5 L 3 14.484375 L 8 10.820313 L 13 14.484375 L 13 3.5 C 13 2.675781 12.324219 2 11.5 2 Z M 4.5 3 L 11.5 3 C 11.78125 3 12 3.21875 12 3.5 L 12 12.515625 L 8 9.578125 L 4 12.515625 L 4 3.5 C 4 3.21875 4.21875 3 4.5 3 Z"/></svg>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Crystal

Related Questions