A white flower on a ground background

I’ve long referred to Scalable Vector Graphics as the “fourth image format”. In the first decade of the web, it felt like the forgotten format, due to lack of browser support. But since IE9, SVG has boasted near-complete support in modern browsers, and it’s been a deep pleasure to see it used in so many different ways on the modern web.

SVG still has some way to go: it’s not yet used for every logo, and it’s much more powerful than mere vector illustrations, as anyone perusing this reading list will learn.

Hero Text

While text in SVG has a number of limitations, at least in the current spec - text can’t be wrapped, and positioning it is more like arranging elements in CSS, rather than the natural “flow” of HTML text - it also has some significant advantages in particular use-cases. Understanding those use-cases, together with the associated SVG text attributes, will allow you to know where and how to employ SVG text in your web page designs.