Introducing Triple Threat Icons

By Matt Visiwig Oct 11, 2023

I’m excited about releasing this special icon set, Triple Threat SVG Icons, because the concept has been floating around in my head for years.

There’s plenty of established icon sets out there, the majority of them are static with a few sets that are animated goodness.

I’m designing this icon set in another category: multi-state icons. This is where each icon has multiple styles that work seamlessly together as one. Check the demo below:

UIs often rely on icons and need to distinguish between several states such the initial non-active state, hover/focus, and selected. With your traditional icons, your options are limited to changing icon color or simply the button’s appearance itself.

Changing the actual icon itself is more than a nice touch, it helps differentiate UI states.

This icon set not only provides the multi-state icon designs, but also exports the CSS necessary to switch between states.

Initially, I’m releasing 40 icons (30 free), each in the three styles, and plan to aggressively grow the collection in the coming months. The big milestone is that I built the mechanism to make preview and export easy. I also provide documentation for the Triple Threat Icons, because CSS is required to pull off the 3-state or 2-state version of the icon set.