color contraste y paletas

Contraste · accesibilidad (WCAG)

—de contraste (1 → 21)
Texto grandeTexto normal de ejemplo para ver la legibilidad.

Paleta desde un color

Tintes y sombras

Complementario

Análogos

Triádico

Contraste y paletas

Contraste. Elige color de texto y de fondo; te digo el ratio de contraste y qué niveles de accesibilidad WCAG cumple: AA (mínimo recomendado, ratio ≥ 4,5 para texto normal y ≥ 3 para grande) y AAA (más exigente, ≥ 7 y ≥ 4,5). «Texto grande» = 18 pt / 14 pt en negrita.

Paleta. Desde un color base saco una escala de tintes (hacia el blanco) y sombras (hacia el negro), y las armonías (complementario, análogos, triádico) girando el tono. Pincha en cualquier muestra para copiar su código.

Todo en tu navegador.