---
name: "design-token-alignment"
description: "Align design artifacts with code tokens and component APIs so spacing, color, type, and states stay consistent through implementation."
---

Use this skill when a design needs to map cleanly onto an existing component system or token set.

Checklist:

- identify which design values already map to existing tokens
- flag values that are near-matches and should be normalized instead of copied literally
- note any missing tokens, variant gaps, or component API mismatches
- keep the recommendation biased toward reuse before extension
- produce a concise token and component mapping table

Good output:

- existing tokens reused where possible
- missing tokens called out explicitly
- API gaps separated from pure styling gaps
- implementation guidance that preserves the current design system shape

Avoid:

- creating one-off tokens for every visual exception
- solving a component API problem with raw styling overrides
- assuming the design tool naming is already production-ready