Master the technical foundations of the platform, including component APIs, token transformation, and the flexible hooking architecture. Build a design system that is as scalable as it is robust.
You'll find this section most useful if you:
| Page | Description |
|---|---|
| Project Initialization | Scaffolding a new project using create-handoff-app. |
| Managing Tokens | How design tokens are structured, extracted, and transformed. |
| Creating Components | The component architecture, file structure, and build pipeline. |
| Component API | The JSON schema for describing components and their properties. |
| Handlebars Templates | How to build components using Handlebars and custom Handoff helpers. |
| React Templates | Using React and TypeScript to implement your design system components. |
| CSF Templates | Implementing components using the Component Story Format (CSF). |
| Configuration Reference | A complete reference of all handoff.config.js settings. |
| Hooking Architecture | Hooks for extending the Handoff pipeline at build time. |
| Governance and Versioning | How to version your system and manage breaking changes safely. |
Handoff's primary role is governance — not just generating CSS variables. Think of it as embedding design authority into your development pipeline, so that every build reflects the current approved design state.