token-documentation

To document design tokens with semantic intent, you need to define what each token communicates, its usage context, and application rules. This prevents system drift by ensuring tokens are applied correctly across primitive, semantic, and component tiers.

Yes, it supports automated integration with Style Dictionary and Figma variables for comprehensive token analysis. This allows you to cross-reference tokens and automatically generate documentation detailing their resolved values across different themes.

The best way to generate tiered documentation for primitive, semantic, and component tokens is to structure the documentation by clearly defining the semantic intent and usage guidance for each tier, including do and don't application examples.

Incomplete design token documentation leads to system drift because it often only details resolved values without semantic intent or usage context. This lack of clarity causes misuse when teams apply tokens incorrectly across different themes and components.

Yes, you can document how tokens behave across different themes by establishing a theming contract. This involves detailing the resolved values and semantic meaning of tokens in light and dark themes to ensure consistent application.

To add usage guidance to design system documentation, you provide context on where and how tokens should be applied. This includes generating do and don't examples that demonstrate correct token usage for specific components and themes.