Learn the essential strategies for effectively consuming design system data in your production applications. This guide explores the various consumption models offered by Handoff, helping you choose the right approach for your tech stack and development workflow. Start leveraging the power of a versioned, governed design system in your projects today.
For modern frontend frameworks, you can import design tokens directly as CSS variables or SCSS maps. This is the simplest way to ensure that your UI foundations—colors, typography, and spacing—are used correctly throughout your codebase.
The Handoff REST API provides programmatic access to your tokens and component definitions. It is ideal for integrations with CMS platforms like WordPress and HubSpot, as well as for custom tooling and CI/CD validation.
The Handoff CLI is a powerful tool for local development and build automation. Use it to fetch the latest tokens from Figma, scaffold new component implementations, and build your documentation site for production.
The right consumption model depends on where you are using the design system. For building production UI, direct token imports are often best. For integrations and automation, the REST API and CLI provide the flexibility and structured data you need to scale effectively.