Sometimes, we want to style SVG with external CSS.
In this article, we’ll look at how to style SVG with external CSS.
How to style SVG with external CSS?
To style SVG with external CSS, we add a style tag.
For instance, we write
<style>
.fill-red {
fill: red;
}
.fill-blue {
fill: blue;
}
</style>
<a href="//www.example.com/">
<svg class="fill-red">
<use xlink:href="images/icons.svg#example"></use>
</svg>
</a>
to add a few styles for some classes in the style tag.
Then we apply the classes to the svg element to apply the styles.
Conclusion
To style SVG with external CSS, we add a style tag.
