Free online color tools that do the math for you
A color palette generator, a WCAG contrast checker, a HEX to RGB color converter and a CSS gradient generator. Every tool reads the same color formats and shows its working. Nothing is stored, nothing needs an account, and each result has its own URL you can share.
Color Palette Generator
Build a color scheme from one color, then lock the swatches you like.
Pick a color you already trust, choose the relationship you want the rest of the palette to have with it, and the generator does the arithmetic. Every swatch is spaced in OKLCH, so the color scheme has an even lightness rhythm instead of five colors that all sit at the same value.
Open the palette generator →Color Contrast Checker
Check WCAG 2.2 contrast ratios and APCA, and get a fix when a pair fails.
Enter a text color and a background color. You get the WCAG 2.2 contrast ratio, a pass or fail at every conformance level, and the APCA lightness contrast that the next version of the guidelines is built on. When a pair fails, the checker works out the nearest color that passes rather than leaving you guessing.
Open the contrast checker →Color Converter
One value in, every format out: HEX, RGB, HSL, LAB, LCH, OKLCH and CMYK.
Paste a color in whatever form you have it: a hex code from a design file, an rgba() value from a stylesheet, a CSS keyword or an oklch() value from a modern token set. You get every other representation, ready to copy. The tonal scale underneath turns a single brand color into the full 50 to 950 ramp a design system needs.
Open the color converter →CSS Gradient Generator
Linear, radial and conic CSS gradients with as many color stops as you need.
Add as many color stops as you need, set their positions, and pick the color space the browser should blend through. Blending in OKLab or OKLCH is the fix for the muddy gray band that appears in the middle of most sRGB gradients between two saturated colors.
Open the gradient generator →Want the theory behind the buttons?
The color theory blog covers why these rules exist: where the color wheel came from, what contrast ratios are actually measuring, and when to ignore the guidance.
Read the articles