Color Tool

Colors live in many notations. The designer sends you a HEX, the stylesheet wants RGB, the print shop asks for CMYK and the animation needs HSL because you can rotate the hue so nicely there. The color tool keeps all four representations in sync: change one and the others follow live. It also understands the 140 named CSS colors, so you can just type "rebeccapurple" or "tomato".

From a single base color the tool builds ready-made harmonies. Complementary, analogous, triadic, split-complementary, tetradic or monochromatic - each palette follows the classic rules of color theory and hands you several coordinated shades that work together. Ideal for a brand, a website or a chart where the colors should not clash.

The contrast checker computes the contrast ratio of two colors and tells you straight away whether it reaches the WCAG AA and AAA levels for normal and large text. Accessibility is not a nice-to-have but a legal requirement for many sites - here you see at a glance whether your text stays readable on its background.

The color-blindness simulation is the honest reality check. Roughly one in twelve men sees colors differently. The tool shows your colors as they arrive under protanopia, deuteranopia, tritanopia or full color blindness. That way you notice early if your red-green status indicator becomes indistinguishable for some of your users.

There is also a gradient generator for linear and radial gradients with multiple stops, an eyedropper to pick a color off the screen (where the browser supports it) and the option to pull colors from an uploaded image. You can name your own palettes and save them locally.

Everything runs in the browser, no account and no image or color value ever travelling to a server. Your drafts stay yours. Results copy with one click, whether you need the HEX code, the CSS gradient rule or the whole palette.