Color Tools

Everything for working with colour — check contrast, build palettes and gradients, generate shades, simulate colour blindness and mix colours. Free and private, right in your browser.

Advertisement Leaderboard 728×90 — ad slot

Color

Contrast Checker

WCAG contrast ratio for text and background, with AA/AAA pass checks and live preview.

Color

Palette Generator

Complementary, triadic, analogous and monochromatic schemes with copy-ready HEX.

Color

Gradient Generator

Build linear or radial CSS gradients with a live preview and copy-ready code.

Color

Shades & Tints

A full range of lighter tints and darker shades from any base color.

Color

Color Blindness Simulator

See how a color looks with protanopia, deuteranopia and tritanopia.

Color

Color Mixer

Blend two colors at any ratio and get the resulting HEX and RGB.

Free color tools for designers & developers

This collection covers the everyday colour jobs — making sure text is readable, building a scheme, generating gradients and shades, and designing for colour blindness. Every tool runs entirely in your browser, so it's fast, free and private.

Start by checking a pairing with the contrast checker, build a scheme with the palette generator, and generate variations with the shades & tints generator. To convert a colour between HEX, RGB and HSL, use the color converter in Dev Tools.