Write SVG: a PostCSS plugin

Here’s a cool PostCSS plugin that lets us write SVG directly in CSS with the rest of our styles:

.arrow {     @svg {         polygon {             fill: green;             points: 50,100 0,0 0,100;         }     } }

These values will then be converted into a data URI, like so:

.arrow {     background-image: url(data:image/svg+xml;utf8, }

Like Sara Soueidan mentions, I’d love to see this in Sass.

Update: David Khourshid has just made sass-svg which lets you write SVG inside a mixin.

Direct Link to ArticlePermalink

Write SVG: a PostCSS plugin is a post from CSS-Tricks