What it does
Duoicons is a duotone icon library with vanilla JavaScript, React, React Native, Vue, Svelte and Tailwind packages.
Duoicons gives interface symbols a primary and secondary tonal layer. Browse by category, adjust color or size, then choose the package for the application. React, Vue, Svelte, React Native, vanilla JavaScript and Tailwind have separate distributions.
The React package, @duo-icons/react, exposes individual components including AlignBottom. Size and color props control the output; CSS variables can theme both layers independently. The Tailwind route instead uses its base styles and named icon classes. Standalone SVG and symbol-SVG forms support direct embedding or sprite sheets.
MIT licensing covers personal projects and commercial applications at no charge. Public package installation is local and needs no Duoicons account. Keep its copyright and permission notice when redistributing files. Framework-specific entry points should follow their own examples rather than assuming one package’s imports work everywhere.
Strengths
- The collection focuses on a consistent duotone treatment.
- Packages cover several web frameworks and React Native.
Best for
- Navigation and controls using a two-tone visual style
Sources
- Duoicons README (Oct 27, 2026)
- Duoicons MIT License (Oct 27, 2026)
- Duoicons gallery and quick-start guide (Oct 27, 2026)