What is Glyphs (glyphs.fyi)?

Updated

Glyphs is an open-source icon design system for creating icon sets in Figma and using them on the web. It provides thousands of editable icons designed in Figma, web components for use with any application, and a CLI utility to download SVGs from Figma. It's suited to designers and developers who want a single, editable source of icons that works both in design files and in production code.

What Glyphs includes

Based on the project's own description, the system is built around a few connected pieces:

  • Thousands of editable icons designed in Figma — the icons are meant to be modified, not just consumed as fixed assets.
  • Web components for use with any application, so the same icons can be dropped into a web front end.
  • A CLI utility to download SVGs from Figma, which bridges the design file and your codebase.
  • Categorized and tagged icons for easier search across a large set.
  • Growing documentation and guides, plus optional light mode everywhere.

The project describes itself as a "fully editable & truly open source design system," and points contributors to its Figma file and GitHub repository for ongoing development and icon or feature requests.

The core idea: one editable source, two destinations

The distinguishing feature of Glyphs is that it treats icons as a design-system asset rather than a static download pack. The workflow implied by the description runs in two directions:

  1. Design side — you work with icons in Figma, where they remain fully editable.
  2. Web side — you consume the same icons through web components, or pull the SVGs out of Figma with the CLI.

That matters if you've ever had a design file and a codebase drift apart because icons were exported once and then edited in only one place. Here, the Figma file is the editable origin, and the CLI is the mechanism for getting those SVGs into your project.

Who it's for

If you are… Glyphs is relevant because…
A designer working in Figma Icons are editable in the design file, not locked assets
A developer shipping a web app Web components let you use the icons directly in an application
Someone maintaining a design system Open source and contribution-friendly, with categorized/tagged icons and growing docs
Someone who needs a quick one-off icon The CLI can pull SVGs from Figma, though the system is oriented toward ongoing use

What to check before adopting it

The project's page describes the system and links to its Figma file and GitHub repository, but it does not state pricing, licensing terms in detail, or account requirements in the material available here. Before committing:

  • Open the GitHub repository to confirm the license and see how actively it's maintained.
  • Open the Figma file to judge whether the icon style and coverage fit your product.
  • Check the documentation and guides for the current setup steps for web components and the CLI, since those are the parts that touch your build.

If your need is a static set of icons you'll never edit, the Figma-and-CLI workflow may be more machinery than you need. If your need is a shared, editable icon source across design and code, that's exactly the problem Glyphs is built to solve.