Getting Started
Figmage turns a published Figma library into design tokens as code. A designer prepares styles and components in Figma; a developer runs one command and gets typed, ready-to-import token files that stay in sync with the design source of truth.
The docs are split into two tracks. Pick the one that matches your role — most teams will use both.
| If you… | Start here | You will learn |
|---|---|---|
| Design or maintain the Figma library | Designers | How to prepare styles, components, names, publishing, and handoff notes |
| Install or run the CLI | Developers | How to configure Figmage, sync tokens, shape output, and automate the CLI |
👨💻 I’m a developer
Section titled “👨💻 I’m a developer”If you are a developer who uses Figmage to pull design tokens from Figma, you can start with the introduction to the developer docs to get started, or jump right in with:
- Quickstart — install, configure, and run your first sync.
- Install and Auth — the full setup, tokens, and CI.
- Configuration — every
figmage.config.jsoption. - Token Types — everything Figmage can generate.
- CLI — the complete command reference.
🎨 I’m a designer
Section titled “🎨 I’m a designer”If your role includes creating and managing a design system in Figma, you can start with the introduction to the designer docs to get started, or jump right in with:
- Styles & Variables — colors, type, and shadows.
- Components — spacing/sizing scales, icons, and images.
- Naming & Grouping — your contract with developers.
- Publish & Share — make your work available to Figmage.
- Handoff & Limitations — a final checklist and what to know.
- New to design systems? Read Why Figmage.
- Want the big picture of what it can do? See Features.