Colour, type and tokens in one place
21 free tools for designers. They all share one palette, so what you make in one tool is waiting in the next.
New here? Start with one of these
Make a colour palette
Start from one colour, or shuffle until something clicks.
Open Palette
Aa10.6:1
AAA
AAA
Check text is readable
Test any text and background against WCAG.
Open Contrast checker
--color-1: #1B3A4B;
--color-2: #3D8B7D;
--color-3: #F2C14E;
--color-4: #F07F5A;
Turn it into code
CSS, Tailwind, JSON, Swift, Flutter or Android.
Open Export tokens
Your palette: Harbour study
Every preview on this page is drawn in these colours. Change them in any tool and the others follow.