72 tools
Design Systems
The token, spec, and handoff system itself. Working with a design system is not this shelf.
tokens.studio icon
Design token management in Figma/Penpot + Git sync
styledictionary.com icon
Transforms tokens → platform code formats
specifyapp.com icon
Design API: collect tokens/styles → distribute to code
supernova.io icon
Auto docs + token/code PRs from Figma
zeroheight.com icon
Design-system documentation hub with token export
storybook.js.org icon
Component playground + auto docs
chromatic.com icon
Visual regression testing for Storybook
knapsack.cloud icon
Full DS platform: docs, live code, tokens, governance
backlight.dev icon
Git-based DS build/test/docs sandbox
zeplin.io icon
Specs, styleguides, multi-platform snippets
figspecs.pro icon
AI specs, anatomy, a11y audits, Jira tickets from Figma
github.com icon
Component Markdown specs + Figma annotation render
Showing 1–12 of 72
1
About this shelf
Design systems fail in the gap between the file and the repo. This shelf is tokens, specs, documentation, converters, and handoff utilities that keep design and engineering looking at the same values. If you are still pasting hex codes into Slack, you want something here.
Converters and file-handoff utilities are a filter because they are a different job from a token pipeline. Use that filter when you need to move a file between tools. Stay on the parent view when you want sources of truth, docs sites, and spec tooling.
Featured picks are the ones we would install before a system grows past a dozen components. The grid includes smaller converters that only matter once a quarter and still save a miserable afternoon. Read why-notable; a lot of these products look similar on a landing page.
This is not a component library shelf. If you need a Button to install, go to UI kits. If you need Figma-to-React, go to design-to-code. If you need the contract between those worlds, stay here.
Questions
- Is this where shadcn/ui lives?
- Component kits live on the UI kits shelf. This page is tokens, specs, docs, and handoff.
- What is the Converters filter?
- File converters and handoff utilities absorbed into this parent so you can find format tools without a second category.
- Do you list token formats like DTCG?
- We list tools that work with tokens and specs. The catalog fields tell you what each product actually does.
- When is a design system tool overkill?
- If you have five components and one developer, a shared Figma library and CSS variables may be enough. Add tooling when values start drifting.