Free for all

Start Your Scalable Design Tokens Set

Focus on Design, Not the Setup.

Simplify the overwhelming process of setting up design tokens with a clear, structured starting point for a scalable design system.

Begin building your Design Tokens Without the Overhelm

Seamless Integration

Figma variables and Tokens Studio-ready JSON on GitHub for a smooth start of your setup.

Pre-Structured Token Tiers and Naming Conventions

Scalable, predefined naming conventions with organized groups and subgroups.
No need to struggle, start right off.

Pairing Tokens for easy ensuring contrast ratios

Ensure WCAG 2.0 and EAA compliance with pre paired contrast color tokens.

Starting made easy

Copy the Figma File

Begin with pre-built variables and styles directly in your workflow.

Download JSON and Start Tokens Studio

Connect the JSON filewith the Figma Variables via Tokens Studio to power up your tokens automation and enhance collaboration between design and development.

Customize & Expand to your needs

Begin with pre-built variables and styles directly in your workflow.

Frequently Asked Questions

I can't find a price. What does it cost?

Nothing :) The starter set is free for all to use and doesn’t cost anything.
It runs under MIT License though a mentioning is enough.

Can I customize the tokens?

Absolutely! Modify them in directly in Figma or use additional Tokens Studio. Consider everything in the starter set as a recommendation how I would set things up. Feel free to custimze it to your design systems requirements.

Do I have to use Tokens Studio?

No. Tokens Studio is totally optional here. It is working perfectly fine when just using Figma and build your setup from there. Do what fits for you!