- The annotation feature of the Design tokens plugin in the "Inspect" Tab adds annotations with the token names
- Test tokens in design https://www.style-dictionary-play.dev/
- IDE (=XCode) in the browser https://replit.com/
Best practices for turning design systems into token design sytems
- Use Similayer plugin to find similar styles
- Create and apply token with help of Remapping from Figma tokens plugin
- Use semantic tokens e.g. background default > Theme-level decisions not global options
- Component level decisions > Theme level decisions > Global options
- Scale tokens: Scaling typography with base font size 16 and multiply with scale (e.g. 16 * scale.h4)
- Tool to
Create Documentation for Figma tokens