What this style means
Duotone icons are two-tone icons that layer a lighter secondary pass behind a heavier primary form. IconStash classifies icons by style across all 28 indexed libraries, so you can hold the weight constant and compare how different design teams solve the same icon.
When to use them. Duotone adds depth without full colour, which is why it works well in empty states, feature cards, and onboarding. It is visually heavy, so avoid it in dense toolbars and small tables.
Every icon below links to a page with the full SVG source, a live preview you can recolour and resize, PNG export at six sizes, and a ready-to-paste React snippet.
What are duotone icons?
Duotone icons are two-tone icons that layer a lighter secondary pass behind a heavier primary form. IconStash indexes 4,568 of them across 6 open-source libraries, so you can compare the same drawing style as interpreted by different design teams.
When should I use duotone icons?
Duotone adds depth without full colour, which is why it works well in empty states, feature cards, and onboarding. It is visually heavy, so avoid it in dense toolbars and small tables.
Which libraries include duotone icons?
On IconStash the strongest coverage comes from Solar Icons (2,354), Phosphor Icons (1,526), Line MD Icons (387). Open any library hub to see its full style range alongside install instructions.
Can I export duotone icons as PNG?
Yes. Every icon on IconStash exports to PNG at 16, 32, 64, 128, 256, or 512 pixels, generated in the browser from the original vector so it stays crisp at any size. You can also copy the raw SVG, export a React component, or build an SVG sprite.
Are these duotone icons free for commercial use?
The libraries indexed here are MIT, Apache 2.0, CC BY 4.0, or CC0 licensed, all of which permit commercial use. CC BY sets such as Solar Icons require attribution — check the license shown on each icon page if you cannot provide credit.