Teoría del color

La teoría del color es el conjunto de principios que explica cómo los colores se relacionan entre sí, cómo los percibe el ojo humano y cómo combinarlos de forma armónica. Nació como disciplina formal con Johann Wolfgang von Goethe y Johannes Itten en los siglos XVIII y XIX, y hoy es la base de cualquier decisión de diseño visual, desde la elección de una paleta web hasta la composición de un cartel.

¿Cómo funciona la síntesis de color?

Existen dos modelos fundamentales según si se trabaja con luz o con pigmentos:

En diseño web siempre trabajamos en síntesis aditiva: sumar los tres canales al máximo da blanco (#FFFFFF), y la ausencia de luz da negro (#000000). Esto es lo que reflejan los formatos Color HEX, Color RGB y Color HSL.

¿Qué es el círculo o rueda cromática?

La rueda de color es la representación visual que organiza los matices en un círculo continuo. En el modelo RYB clásico de Itten, los 12 colores se distribuyen así:

• Primarios (3): rojo, amarillo, azul.
• Secundarios (3): naranja (rojo + amarillo), verde (amarillo + azul), violeta (azul + rojo).
• Terciarios (6): mezclas de cada primario con su secundario adyacente.

La posición en la rueda determina qué combinaciones son armónicas: los colores opuestos son complementarios, los adyacentes son análogos y los equidistantes forman tríadas.

Propiedades básicas de un color

Cualquier color puede describirse con tres atributos:

1. Matiz (Hue): el «nombre» del color: rojo, azul, verde. En HSL es el eje de 0° a 360°.
2. Saturación: la pureza o intensidad del color. Al 100 % es el tono puro; al 0 % es un gris neutro.
3. Luminosidad (Lightness): la cantidad de luz. Al 0 % es negro, al 100 % es blanco, al 50 % es el tono pleno.

Estos tres valores son exactamente los que controla el modelo HSL, lo que lo hace el más intuitivo para ajustar colores programáticamente.

Temperatura del color

• Colores cálidos (rojos, naranjas, amarillos, aprox. 0°-60° y 300°-360° en la rueda): generan sensación de energía, proximidad y urgencia. Son frecuentes en llamadas a la acción.
• Colores fríos (azules, verdes, violetas, aprox. 120°-270°): transmiten serenidad, confianza y distancia. Predominan en banca, tecnología y salud.
• Neutros (blancos, grises, negros, marrones desaturados): no tienen temperatura marcada y actúan como soporte para que los demás colores destaquen.

Psicología del color (usos comunes en marketing)

Estas asociaciones varían según la cultura. El blanco simboliza pureza en Occidente pero duelo en algunas culturas asiáticas; el rojo es suerte en China y peligro en muchos contextos occidentales.

Aplicación al diseño web: de la teoría a la paleta

La teoría del color no se aplica de forma aislada: define la estructura sobre la que se construye una paleta de colores y guía las decisiones de contraste WCAG para accesibilidad. Los pasos habituales son:

1. Elegir un color de marca (normalmente entre los tonos medios de la rueda para que admita variantes claras y oscuras).
2. Derivar los colores complementarios o análogos según el tipo de paleta.
3. Generar una escala de tonos ajustando saturación y luminosidad en HSL.
4. Verificar el contraste de cada par texto/fondo antes de fijar la paleta.

Esta información es orientativa y no constituye asesoramiento de diseño profesional. Los resultados pueden variar según el contexto, el dispositivo y el perfil cultural del público objetivo.