SVG Icons

Icons are one of the most used type of website graphic, and can come in many sizes and styles, such as duo-tone icons. Icons are commonly used for UI design, but there are many other use cases.

We have designed three icon sets and are continually adding icons to the collections, including plenty of free icons. Make sure you check out the Triple Threat Icon set, our innovative svg-based icon collection where every icon is designed in three distinct styles, allowing designs to have multiple states. Such as a button that can be in an initial static state, a hover state, and a selected state. While you can download icons as PNG, we recommend reaching for icons as SVG as much as you can.

How to choose a good SVG icon pack

When finding the perfect icon set, you’ll want to make sure the style fits your brand. While the color of SVG icons can be changed to match your brand or website colors, certain icon styles may appear too playful for serious brands, or too generic looking for a bold brand. Also, some icons are meant for UI, so they’re meant to be displayed small, while displayed in large contexts, they look clunky, primitive, and out-of-place.

You’ll want icons that symbolize a wide variety of meanings, concepts, and categories. You may be able to find a few perfect icons in a small icon set, but you may also find it difficult to find fitting icons for other places or purposes. Finding a icon set with a good quantity, as well as quality is important.

Why SVG is the ideal icon format

Other than 3d-style icons, SVG is the best format for icons for several reasons. The main reason when you inline SVG icons in your HTML, you can manipulate the icons with CSS, including changing colors, stroke thickness, and potentially even animating the icons — especially with hover effects.

SVGs are made of code, so it’s just simple to integrate into projects by copy-and-pasting individual icons as you need them, no giant bloated icon libraries or scripts needed. So SVGs are small in filesize, so use them individually when it makes sense.

We have created and published a few icons sets, links above, but there are lots of collections of icons across the web, and we have an article on some of our favorite icon sets that are fast to integrate into your projects.