fandeck.

Five colors from one you pick, with locks, a contrast grid and CSS or Tailwind exports.

2026rebuiltlive
JavaScriptCSS

overview.

Fandeck is a palette tool with no framework, build step or dependencies. Pick one color and a harmony and it hands back five that work together, laid out like paint chips with a name, a value and live text samples on each. The Color API makes the scheme and names every shade. Lock the ones you like, shuffle the rest, check every pair for contrast, and take the palette away as CSS, Tailwind, JSON or a PNG.

The first version, Color Scheme Generator, was a color input, a dropdown of harmonies and five swatches to copy. The rebuild is named after the fan of paint chips you flip through in a paint store, and asks what picking a palette should actually feel like: judged against neutral grey, checked for contrast, and ready to drop into a project.

live playground.

Operational
open in new tab

Try Fandeck right here: pick a color, lock a chip and shuffle the rest.

what you can do.

Pick a color and a harmony, and get five that work together
Lock the chips you like and shuffle the rest
Check every pair for contrast, at AA large, AA or AAA
Export as CSS variables, a Tailwind v4 theme, JSON or a PNG

a closer look.

Fandeck's picker at hues 25, 145 and 265, each lightness by chroma square filled edge to edge

A picker that's always full

An OKLCH square has corners no screen can show, and most pickers leave them blank or clip them. Here each row runs out to the most saturated color a screen can show at that lightness, so the square is full at every hue.

A seven by seven grid of the palette plus white and black as text on each other, with the pairs that fail AA faded and struck through

Every pair, checked

Palettes end up as text on backgrounds, so every color is tried as text on every other, plus white and black, with its WCAG ratio worked out in the browser. Pairs that miss the level you pick fade and get struck through.

screenshots.

Fandeck screenshot 1

Home

1 / 9

next upPalettes of more or fewer than five colors, and APCA contrast alongside WCAG 2.