Which SVG technique performs best for way too many icons?

Tyler Sticka digs in here in the best possible way: by making a test page and literally measuring performance. Maybe 1,000 icons is a little bit of an edge case, but hey, 250 rows of data with four icons in each gets you there. Tyler covers the nuances carefully in the post. The different techniques […]

Favicons: How to Make Sure Browsers Only Download the SVG Version

Šime Vidas DM’d me the other day about this thread from subzey on Twitter. My HTML for favicons was like this: <!– Warning! Typo! –> <link rel=”icon” href=”/favicon.ico” size=”any”> <link rel=”icon” href=”/favicon.svg” type=”image/svg+xml”> The attribute size is a typo there, and should be sizes. Like this: <!– Correct –> <link rel=”icon” href=”/favicon.ico” sizes=”any”> <link rel=”icon” […]

How I Made a Generator for SVG Loaders With Sass and SMIL Options

While learning Vue.js, I started building free web tools that involved the exploration of SVG, with the goal of learning something about both! Let’s take a look at one of those tools: a generator that makes SVG loaders and lets you choose between SMIL or Sass animation, different styles, colors, shapes, and effects. It even […]

SVG Gobbler

Great little project from Ross Moody: SVG Gobbler is a browser extension that finds the vector content on the page you’re viewing and gives you the option to download, optimize, copy, view the code, or export it as an image. When a site uses SVG as an <img>, you can right-click/save-as like any other image. […]

Pin It on Pinterest