The five best design links, every weekday

Category: Svg

All Categories


Free svg background generator for your websites, blogs and app.

How to Get Handwriting Animation With Irregular SVG Strokes

I wanted to do a handwriting animation for calligraphy fonts — the kind where the words animate like they are being written by an invisible pen.

Warp SVG online

Warp and distort SVG files online

Tabler Icons

550+ Highly customizable & free SVG icons.


Create and export beautiful SVG squircles to use in your designs.

React Icon System

This article will show you how to set up an icon system using SVGR — a tool for transforming SVGs into React components.

Blobs - Generate beautiful blob shapes for web and flutter apps

Customizable blobs as SVG and Flutter Widget. Create random or fixed blobs, loop, animate, clip them with ease


An online tool to create and export patterns using some font icon libraries

Shape Divider App

Generate a beautiful SVG shape divider in a few clicks.

SVG Path Visualizer

Enter an SVG path data (the string inside the d attribute) to visualize it and discover all its different commands.

Stencil Icons

In the last ten years, developers have been on a quest to find the best way to implement icons in a digital product.

Morphing Gooey Text Hover Effect

Three gooey morphing hover effects using SVG filters for menu links based on a demo by Graham Pyne.

Are you using SVG favicons yet? A guide for modern browsers.

You should be using SVG favicons. They're supported in all modern browsers right now.

SVG Artista - Little tool that helps you create SVG drawing animations

SVG Artista is a tool that helps you animate stroke and fill properties in your SVG images with plain CSS code.

SVG, Favicons, and All the Fun Things We Can Do With Them

Favicons are the little icons you see in your browser tab. They help you understand which site is which when you're scanning through your browser's

Creating a Pencil Effect in SVG

Vector graphics have a lot of features (such as lossless zoom) that are nice for maps.

Flexible Repeating SVG Masks

This is a technique I used recently to create a flexible, repeating pattern using SVG with CSS mask.

Accessible SVGs: Inclusiveness Beyond Patterns

If true inclusiveness lies beyond patterns - what other factors should we consider when designing and developing accessible SVGs?

How We Created a Static Site That Generates Tartan Patterns in SVG

Tartan is a patterned cloth that's typically associated with Scotland, particularly their fashionable kilts.

Distorted Link Effects with SVG Filters

A couple of ideas for decorative link distortion effects using SVG filters on lines, circles and squares.