🎨
✏️

Generate Color Styles for Figma

Create color palettes to use as Figma Color Styles and design token foundations.

Níl gá le logáil isteach
Complementary · 2 colors

Figma tips

✏️

Generate your palette here, then create matching Color Styles in Figma. Paste each hex code when creating a new style.

💡

Figma Variables (design tokens) accept hex colors. Export your palette as hex values and create primitive tokens for each shade.

🎨

The shades palette produces a consistent tonal scale — map these to Figma token names like "primary-100" through "primary-900".

📋

Use "Copy all" to get all hex codes as a comma-separated list, then paste them into your design token JSON file or style guide document.

Conas a Oibríonn sé

1
Cuir isteach
Enter your data into the tool above. Everything stays local to your browser.
2
Próiseas
The tool processes your data instantly in your browser using JavaScript. No server, no waiting.
3
Íosluchtaigh
Get your result instantly. Nothing is stored after you leave the page — complete privacy.

Cén fáth ár gceann a úsáid?

Go hiomlán saor in aisce - gan aon chostais i bhfolach, riamh
Níl cuntas, ríomhphost ná logáil isteach ag teastáil
Ní fhágann comhaid do ghléas riamh
Níl aon teorainn le méid comhaid ar bith
Gan comhartha uisce ar aon aschur

Also check out…

Ceisteanna Coitianta