Actualizado el 10 de noviembre de 2026 por Nicolas Finet, CEO de Sortlist. Hemos reescrito esta guía: qué es el círculo cromático, cómo se construye con colores primarios, secundarios y terciarios, las armonías más usadas (complementaria, análoga, triádica, tetrádica y monocromática), cómo crear una paleta con él y cómo comprobar el contraste.
El círculo cromático organiza los colores en una rueda según su relación. Sirve para elegir combinaciones que funcionan juntas, tanto en diseño gráfico y web como en interiorismo o moda.
Lo esencial
- Las armonías cromáticas son esquemas de partida: complementarios (opuestos), análogos (vecinos), tríada y tetrada; úsalos con un color dominante y neutros.
- Hay varios modelos: el tradicional (rojo, amarillo, azul), el aditivo RGB (pantallas) y el sustractivo CMYK (impresión); elige el que corresponda a tu soporte.
- Una combinación bonita puede ser ilegible: comprueba el contraste (WCAG 2.2: 4,5:1 para texto normal en nivel AA).
Qué es el círculo cromático
Es una representación circular de los tonos. Se organiza en colores primarios (los que no resultan de mezclar otros), secundarios (mezcla de dos primarios) y terciarios (mezcla de un primario y un secundario vecino).
| Modelo | Primarios | Uso |
|---|---|---|
| Tradicional (pigmento) | Rojo, amarillo, azul | Pintura y enseñanza del color |
| RGB (aditivo) | Rojo, verde, azul (luz) | Pantallas y diseño web |
| CMYK (sustractivo) | Cian, magenta, amarillo (más negro) | Impresión |
Tres propiedades del color
- Tono (matiz): el color en sí (rojo, azul, verde).
- Saturación: intensidad o pureza del color.
- Luminosidad (valor): cuánto claro u oscuro es.
Ajustar saturación y luminosidad de un mismo tono da variaciones útiles para fondos, botones y estados sin salirte de la paleta.
Armonías de color: cuándo usar cada una
| Armonía | Cómo se construye | Efecto | Uso recomendado |
|---|---|---|---|
| Monocromática | Un solo tono con distinta luminosidad y saturación | Calma y coherencia | Interfaces sobrias, marcas minimalistas |
| Análoga | Tonos contiguos en el círculo | Armonía suave | Fondos e ilustraciones; poco contraste entre elementos |
| Complementaria | Dos tonos opuestos | Contraste fuerte | Destacar un botón o un elemento clave |
| Complementaria dividida | Un tono y los dos vecinos de su opuesto | Contraste con menos tensión | Paletas con acento vivo |
| Triádica | Tres tonos equidistantes | Variedad equilibrada | Marcas lúdicas o creativas |
| Tetrádica | Dos pares de complementarios | Rica pero difícil de equilibrar | Proyectos con experiencia en color |
Regla práctica 60-30-10: un 60 % de color dominante (normalmente neutro o de marca), un 30 % de secundario y un 10 % de acento para las acciones. Evita que todos los colores compitan por la atención.
Consejo del equipo editorial de Sortlist
Cómo crear una paleta con el círculo cromático
- Parte de tu posicionamiento: qué quieres transmitir. Ver significado de los colores.
- Elige un color principal de marca.
- Escoge una armonía (análoga, complementaria…) para los secundarios.
- Añade neutros: blancos, grises y negros para texto y fondos.
- Define estados: hover, activo, error, éxito y desactivado.
- Prueba el contraste y la versión impresa.
- Documéntala en el manual de marca. Ver manual de identidad corporativa.
Comprueba el contraste antes de decidir
- Las WCAG 2.2 piden, en nivel AA, una relación de contraste de al menos 4,5:1 para texto normal y 3:1 para texto grande y componentes de interfaz.
- Dos colores complementarios saturados (por ejemplo, rojo sobre verde) vibran y son difíciles de leer, y pueden ser indistinguibles para personas con daltonismo.
- Usa verificadores de contraste y simuladores de daltonismo.
Más en accesibilidad web y identidad visual.
Errores frecuentes
- Usar demasiados colores sin jerarquía.
- Elegir armonías solo por estética, sin considerar legibilidad.
- Olvidar que RGB y CMYK no reproducen exactamente los mismos colores.
- No definir neutros ni estados.
- Copiar paletas sin relación con la marca.
Preguntas frecuentes sobre el círculo cromático
¿Cuántos colores debe tener una paleta?
Un principal, uno o dos secundarios, un acento y neutros.
¿Qué diferencia hay entre primarios en pintura y en pantalla?
En pigmento son rojo, amarillo y azul; en pantalla (luz), rojo, verde y azul; en impresión, cian, magenta y amarillo.
¿Qué armonía es la más segura?
La análoga o la monocromática con un acento complementario.
¿Cómo sé si mis colores se leen bien?
Con un verificador de contraste según los niveles de WCAG.
¿Necesitas ayuda? Publica tu proyecto en Sortlist y compara agencias de España.
Fuentes: W3C, WCAG 2.2; elaboración del equipo editorial de Sortlist.