Armador de paletas con contraste accesible

Cómo leer el resultado

La escala genera once pasos del mismo tono, del más claro (50) al más oscuro (950), manteniendo el matiz y ajustando luminosidad y saturación. Es la base de cualquier sistema de color: fondos suaves, bordes, estados hover y textos salen de la misma familia.

La armonía propone colores de acompañamiento según la rueda cromática. Tomalos como punto de partida: una armonía matemáticamente correcta puede no tener nada que ver con la personalidad de la marca.

La tabla de contraste calcula el ratio WCAG 2.x entre combinaciones habituales de texto y fondo:

• AA texto normal: ratio mínimo 4.5:1. Es el piso razonable para cualquier párrafo.
• AA texto grande: 3:1, válido para títulos desde 24 px, o 18,66 px en negrita.
• AAA: 7:1. Ideal para textos largos y públicos con baja visión.

Errores comunes

• Elegir el color de marca para textos de cuerpo sin chequear contraste. Muchos naranjas, verdes y celestes de marca no llegan a 4.5:1 sobre blanco.
• Probar el contraste solo en la pantalla del diseñador. El brillo alto engaña: en un celular al sol la diferencia se pierde.
• Resolver todo con gris. Un gris medio sobre blanco suele fallar; usá un paso oscuro de la escala de tu color en vez de un gris neutro.

El ratio WCAG es una medida útil pero no perfecta: no contempla tamaño real, grosor de la fuente ni el contexto. Si algo apenas pasa, probalo con usuarios y en dispositivos reales.