Color Picker

Drag in the square, then set hue and opacity.

Type any color (hex, rgb, hsl, hsv, cmyk or a CSS name) into a box and press Enter. CMYK is a simple formula, not a printer profile.

Space rerolls. Tap the lock on a color to keep it.

Colors

Text

Background

21:1

Large text (24px)

Normal text at 16px. The quick brown fox jumps over the lazy dog.

Small print at 13px is harder to read.

Button

Contrast ratio = (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color. L is relative luminance as defined in WCAG 2.x: each sRGB channel c (0 to 1) becomes c / 12.92 if c ≤ 0.04045, otherwise ((c + 0.055) / 1.055)^2.4, and L = 0.2126 R + 0.7152 G + 0.0722 B. AA needs 4.5:1 for normal text and 3:1 for large text (24px, or 18.66px bold); AAA needs 7:1 and 4.5:1; UI parts and graphics need 3:1. Ratios are not rounded up.

Round1 / 10

Score0

Best-

Which hex code is this color?

Target

Yours

Want more color? Fill in a picture in Coloring.