Huely color system builder

Huely/Tools

Color tools

Six tools, one idea: a color decision should be checkable before it reaches a codebase. Everything below runs in your browser — no account, no upload, and the colors you type stay on your machine.

Which one do you need?

If you are trying to…Use
Start a palette from nothingPalette builder
Find out whether two colors pass WCAGContrast checker
Check a palette still works for color-blind usersColor blindness simulator
Turn a HEX into RGB, HSL or OKLCHColor converter
Pull a palette out of a photo or screenshotImage palette extractor
Write a CSS gradient that does not go grey in the middleGradient generator

The tools

Each one is a full page rather than a widget: the tool is at the top, and the reference material that explains its output is underneath it.

Palette builderTwelve generation schemes, per-swatch locking, 50–950 OKLCH tonal ramps, contrast grading for every pair, a live UI preview and token export. WCAG contrast checkerThe ratio between two colors graded against AA and AAA for body text, large text and non-text UI — plus the smallest repair that passes. Color blindness simulatorDeuteranopia, protanopia, tritanopia and achromatopsia, with a warning when two palette colors stop being distinguishable. Color converterHEX, RGB, HSL, HSB, CMYK and OKLCH in every direction, with the tonal ramp and the nearest color name alongside. Image palette extractork-means clustering in OKLab on a canvas in your browser. The file never leaves the page — there is no upload endpoint for it to leave through. CSS gradient generatorLinear, radial and conic gradients interpolated in OKLCH, so the midpoint stays in the hue family instead of turning muddy.

What these tools share

Every tool here is built on the same color engine: sRGB to OKLab/OKLCH conversion, WCAG relative-luminance contrast, and gamut mapping that reduces chroma rather than clipping channels. That matters in practice — a ratio you read in the contrast checker is the same number the palette builder grades a pair with, and a ramp you copy out of one tool matches the ramp another one exports.

None of it runs on a server. There is no API call behind a conversion, no image upload behind the extractor, and no account behind saving a palette: saved palettes live in your browser's local storage, and a shared palette travels in the URL itself. See privacy for the one thing that does leave the page.

Guides that go with them