About ColorKit

Eight groups, each answering a different question you hit mid-build. The catalogue on the homepage lists all of them with a line on what each one does.

• Pick & convert — 12 tools
• Palettes — 8 tools
• Color from images — 2 tools
• Accessibility — 3 tools
• Gradients & effects — 13 tools
• Layout & motion — 8 tools
• Units & typography — 10 tools
• Web assets — 10 tools

Every tool on the site shares one color module, so a hex code parsed on one page means exactly what it means on the next. sRGB is the hub: parsing lands there, and every other space is one hop away. That matters more than it sounds, because the alternative — each page carrying its own conversion — is how a site ends up telling you two different things about one color.

1. Parsing. One function accepts three-, four-, six- and eight-digit hex with or without the leading #, rgb() and hsl() in both the comma form and the CSS Color 4 slash form, hue in deg, rad, grad or turn, percentages anywhere they are legal, and all 148 CSS keywords. Anything it cannot read returns nothing rather than a guess, so a typo shows as an error instead of silently becoming black.
2. Perceptual work. Distance between colors, nearest-name lookup and evenly spaced palette ramps all go through CIE Lab under a D65 white point. Lab exists because a fixed jump in RGB does not read as a fixed jump to the eye, which separates greens far more finely than blues, so an RGB-distance nearest-name match picks names that look wrong even though the arithmetic is right.
3. Contrast. Relative luminance follows the WCAG 2.1 definition — linearise each channel, weight them 0.2126, 0.7152 and 0.0722 — and the ratio is (lighter + 0.05) / (darker + 0.05), between 1:1 and 21:1. Translucent colors are composited over the background first, because the ratio is only defined for opaque pairs.

Three places, and each one is marked on the page it affects rather than buried here.

CMYK. The conversion is the device-independent formula with no ICC profile behind it. It is exactly reversible, which is the giveaway: real separations depend on the press profile, the paper and the ink limit, and roughly a third of sRGB has no CMYK equivalent at all. The RGB to CMYK page says so where you can see it.

Pantone. Spot inks are physical mixtures, not screen colors. What the Pantone to RGB page gives you is the closest sRGB approximation with the Lab distance printed beside it, so you can see when the approximation is poor rather than assuming it is fine.

Color-vision simulation. The simulator uses the Machado, Oliveira and Fernandes (2009) model, the same one Chrome DevTools uses. It reproduces what a dichromat's cone response predicts; it cannot reproduce a lifetime of adaptation, so treat it as a test for whether two colors are distinguishable, not as a window into someone's experience.

Every page is generated ahead of time and served as a static file — there is no server-side code and no API to call. The tools themselves are JavaScript that runs in your tab, which is why they respond as fast as you can type and keep working with the network disconnected.

One domain for 66 tools is a deliberate choice. Each of these queries is too small to carry a domain of its own, but together they compound: the links between them pass authority around, one name accumulates trust, and someone who arrived to convert a hex code finds the contrast checker they were going to need next anyway. The cross-links at the foot of each page are that structure made visible.

Colors, images and text you put into any tool are processed in your browser and are never uploaded, logged or stored on a server. Two things are written to your own device and nowhere else: the swatch strip on the color picker, kept in local storage under the key colorkit:swatches, plus whatever your browser caches to load the pages faster.

This describes what ColorKit does. It says nothing about what a browser extension, a corporate proxy or the machine itself might see — only that this site adds nothing to that list.