Swatchhh

Turn one hex color into a full 50–950 scale with WCAG contrast, then export it as CSS, Tailwind or raw hex.

Swatchhh turns one color into a complete Tailwind-style palette in a single click. Type, pick or eyedrop a hex color and get an 11-step scale from 50 to 950, with your color pinned at 500. Every step shows its WCAG contrast ratio against white and black, graded AAA, AA, LG (large text) or FAIL, so you can see which shades are safe for text before you use them. WHAT YOU CAN DO • Generate a 50→950 scale from any hex color • Check WCAG contrast on white and black for every step • Pick colors with a built-in picker or the screen eyedropper • Copy any single swatch with one click • Export the whole scale as CSS variables, a Tailwind config (v3 or v4 @theme) or raw values • Choose your color space: HEX, OKLCH or LCH • Name your palette, and the export uses that name • Recent palettes are saved automatically so you can jump back to them • Light and dark themes, following your system or switched manually PRIVATE BY DESIGN Swatchhh works entirely inside the popup. It has no account, no analytics and no network requests. Your recent palettes are stored locally in your browser and never leave your device. Swatchhh is free.