About

Some icons for you, from bob.fyi.

fyicons is a collection of SVG icons and corresponding React components exported and generated directly from Figma. Each icon is drawn on a 16×16-pixel canvas with a base 1px stroke and a goal of pixel-perfection.

Optimization

Figma exports pass through a shared cleanup process to become downloadable SVGs and/or React components. A script joins any overlapping fills and strokes into shared paths and removes any seams that sometimes crop up from Figma exports. SVGO then reduces markup and rounds points to 3 decimal places to reduce file size, while still preserving any masks, clipping, or transparency.

SVGR then transforms the SVGs into React components with shared props and exports. The React package uses ESM and supports tree shaking, so unused icons are kept out of your bundle.

Pick your poison

For React projects, you can import icon components via npm install fyicons or snag local copies with the shadcn/ui registry. For other uses, you can copy or download SVGs individually or in bulk. All formats use the same artwork.

Get started with the format that fits your project, or browse the icons to explore the collection.

Updates and contributions

This library is in initial development and is actively changing. Icon names and React exports can change before version 1.0, so review the changelog before updating.

Some icon names have naming conventions or numeric suffixes that may change as the library grows, and syntax is locked down. A manifest keeps previous names as lookup aliases for the website; those aliases do not preserve old React export names.

Visit the GitHub repository for source files and contribution instructions. Use its issues to report a problem or request an icon.

License

Icons, components, and helpers are available under the MIT license. Free to use however and wherever you so please. Just be nice to them, and a little credit is always appreciated.