Saltar la navegación

5.2. Color

El color es una percepción visual generada por la interacción de la luz con los objetos, captada por los ojos y procesada en el cerebro. No es una propiedad de los objetos, sino el resultado de la luz reflejada por la materia y procesada por el sistema visual. 

De la misma forma que sucede con la tipografía, el color en un contenido didáctico no solo es importante por razones estéticas, sino por su aportación cognitiva, estructural y emocional, y su influencia para la comprensión de los contenidos. 

La Teoría del Aprendizaje Multimedia de Richard Mayer (2020) indica que las personas procesan la información de manera más efectiva cuando se presenta mediante una combinación de palabras e imágenes, en lugar de utilizar únicamente texto. Bajo esta premisa, Mayer definió una serie de principios para optimizar la creación de materiales educativos que integran diversos formatos como texto, audio, video e imagen. Entre ellos, destaca el principio de señalización, el cual sostiene que el aprendizaje se potencia cuando se resaltan explícitamente los elementos clave del contenido. En estrecha relación con este principio, el uso estratégico del color se vuelve fundamental, ya que, según el autor "mediante el color es posible establecer jerarquías visuales que permiten organizar la información y captar la atención del estudiante". Por tanto, el color deja de ser un elemento meramente ornamental para convertirse en una herramienta pedagógica que reduce la carga cognitiva, guiando la vista hacia los conceptos clave de forma intuitiva y eficaz.

Antes de profundizar en el uso pedagógico del color, es preciso abordar los siguientes conceptos fundamentales:

Generación del color. Modelos RGB y CMYK

Según el medio utilizado, existen dos formas de generar color: la síntesis aditiva (colores luz) y la síntesis sustractiva (colores pigmento).


Síntesis aditiva:

Es el proceso mediante el cual el color se crea sumando las longitudes de onda emitidas por una fuente de luz, motivo por el que se le denomina colores luz. Sus colores primarios son rojo (red), verde (green) y azul (blue), dando lugar al modelo RGB que es el utilizado en pantallas de ordenadores y dispositivos móviles, por tanto, el utilizado para el diseño de contenidos multimedia.

Síntesis sustractiva:

Es el color conseguido mediante materiales que absorben (sustraen) una parte de la luz y refleja el resto. Estos productos, habitualmente tintas y pinturas, son los utilizados en la industria de la impresión y se les denomina colores pigmento. Sus colores primarios son cian (cyan), magenta (magenta) y amarillo (yellow), a los que se añade el negro (black) para conseguir una mayor nitidez, dando lugar al modelo CMYK.

Recomendación: Para la creación de contenidos educativos digitales siempre se debe trabajar con el modelo de color RGB, pues es el que garantiza que los colores se visualizarán en pantalla como desea el diseñador.

Imagen 5.11. Síntesis aditiva y sustractiva del color (SUBDEVA)

Propiedades del color

Son las características que determinan cómo se percibe un color y cómo interactúa con el entorno. Las dimensiones fundamentales son el tono, la saturación y la luminosidad. Aunque es una interpretación perceptiva derivada del tono, también se incluye en este apartado la temperatura.


Tono:

Es el nombre del color y se refiere a su posición en el círculo cromático. Algunos tonos son rojo, azul y amarillo.

Saturación:

Representa el grado de pureza o intensidad cromática de un color. Una saturación elevada da lugar a colores vibrantes y definidos, mientras que una saturación reducida neutraliza o apaga el color, desplazándolo hacia tonalidades grisáceas.

Luminosidad o valor:

Define la claridad u oscuridad de un color, reflejando la cantidad de luz que proyecta. Una luminosidad elevada desplaza el color hacia tonos próximos al blanco (colores claros), mientras que una reducida lo aproxima hacia el negro (colores oscuros).

Temperatura:

Se corresponde con la sensación de calidez o frialdad que trasmite un color. Colores cálidos como el rojo, el naranja y el amarillo, evocan energía y dinamismo, mientras que colores fríos como el azul, el verde y el violeta, se asocian con calma, lejanía y serenidad. 

Imagen 5.12. Propiedades del color (SUBDEVA)

Clasificación del color. El círculo cromático

Para comprender cómo se relacionan los colores entre sí y cómo combinarlos con coherencia es necesario conocer su organización básica y, para ello, es fundamental conocer el círculo cromático.


El círculo cromático es una representación visual de los colores que los ordena según su relación estructural y proximidad tonal. Esta herramienta permite identificar los colores fundamentales y entender cómo se generan los demás a partir de ellos. Según OpenAI (2026): “El círculo cromático facilita la creación de combinaciones cromáticas equilibradas y armonías, algo esencial en el diseño de materiales didácticos claros y visualmente eficaces.” 


En el círculo cromático se distinguen tres categorías de colores: primarios, secundarios y terciarios.

 Colores primarios:

Son los que no se pueden obtener mediante la mezcla de otros. Los colores primarios luz son rojo, verde y azul (RGB) y los primarios pigmento son cian, magenta y amarillo (CMY).

Colores secundarios:

Son los que se obtienen mediante la mezcla de dos colores primarios en proporciones iguales. Los colores secundarios luz son cian, magenta y amarillo (CMY) y los secundarios pigmento son rojo, verde y azul (RGB).

Colores terciarios:

Son los que se obtienen mediante la mezcla de un color primario y otro secundario adyacente. Con estas combinaciones se consiguen tonos con nombres compuestos que reflejan su composición y su nombre no está tan normalizado, como por ejemplo los tonos amarillo verdoso o rojo violáceo.


La comprensión de los colores primarios, secundarios y terciarios es el fundamento para el estudio del círculo cromático. Esta herramienta consiste en una representación circular organizada habitualmente en doce sectores: tres sectores para los colores primarios, tres sectores para los colores secundarios y seis sectores para los colores terciarios. Su estructura no solo facilita la visualización de las relaciones cromáticas, sino que permite predecir con precisión combinaciones eficaces, fundamentadas en los principios de armonía y contraste. 

Cada uno de los 12 sectores del círculo representa un tono. Si se observan los anillos concéntricos, la variación radial indica cambios en la luminosidad; en la zona interior se sitúan los colores más claros (más luminosos), en la zona media los más puros y en la zona exterior los más oscuros (menos luminosos). El círculo cromático también es un instrumento útil para explorar la temperatura del color, situándose los colores cálidos en un semicírculo y los fríos en el opuesto.

Imagen 5.13. El círculo cromático (SUBDEVA)

Armonía y contraste

Los conceptos descritos anteriormente son fundamentales para comprender la naturaleza y el comportamiento del color, pero no resuelven el principal desafío al que se enfrenta el docente: seleccionar una paleta cromática que equilibre con éxito el contraste y la armonía para potenciar el aprendizaje. 

Por este motivo, en los siguientes apartados se presentan recursos y herramientas digitales —como Adobe Color— junto con pautas estratégicas para diseñar armonías cromáticas eficaces. El objetivo es proporcionar al docente criterios claros para transformar la teoría en soluciones visuales funcionales para el diseño de contenidos digitales. 


El contraste en el color se refiere a la diferencia notable entre dos o más colores con la finalidad de destacar o resaltar ciertos elementos. Se puede conseguir mediante la diferencia en el tono (colores opuestos en la rueda cromática), la cromaticidad (intensidad o saturación del color) y la luminosidad (claridad u oscuridad de los colores). Cuanto mayor sea la diferencia entre los colores más fuerte será el contraste, lo que genera un efecto visual impactante y atractivo.


En diseño, la armonía cromática es la combinación coherente de colores de manera que resulten equilibrados y visualmente agradables. Según Google AI (2026): "La armonía surge cuando los colores: comparten cierta lógica o parentesco (por ejemplo, cercanía en el círculo cromático); mantienen un equilibrio visual (ninguno domina de forma caótica); y generan una unidad estética”.

En términos pedagógicos, la armonía no solamente es una cuestión estética, sino que mejora la legibilidad del contenido y refuerza la jerarquía visual.


 En los siguientes apartados se describen diversos tipos de armonía cromática de eficacia probada, los cuales permiten organizar el contenido de forma coherente y visualmente atractiva.

Imagen 5.14. Combinación de colores sin armonía (izquierda) y con armonía (derecha) (SUBDEVA)

 En el ejemplo de la izquierda se utilizan dos colores que están dentro del rango de colores complementarios, pero sin un criterio claro de armonía. Sin embargo, en el de la derecha, se utilizan los mismos tonos pero ajustados para mantener el contraste y armonía necesarios.

Adobe Color

Adobe color es una aplicación de Adobe muy útil para crear paletas de color con contraste y en armonía. Disponible en https://color.adobe.com/es/ es una herramienta online y gratuita que permite diseñar, explorar y guardar paletas de color. El acceso es libre, por tanto, no es necesario estar registrado en la aplicación, pero sí es recomendable.


Una vez en la aplicación, hay que acceder a la opción “Crea temas de color” y en la parte superior del interface se identifican los siguientes menús

  • Crear: Para generar y editar paletas de color basadas en reglas de armonía o a partir de imágenes.
  • Explorar: Imágenes creadas por miembros de la comunidad de Adobe y sus correspondientes paletas de color. Se utiliza para identificar paletas de color funcionales extraídas de las imágenes y como fuente de inspiración.
  • Otros menús son: Tendencias —paletas de color de moda— y bibliotecas —para organizar las paletas de color del usuario registrado—.  
Imagen 5.15. Adobe Color. Menú crear.

En el menú “crear”, al seleccionar la opción “rueda cromática”, es posible elegir, en el menú desplegable lateral, entre las siguientes reglas de armonía de color: análogos, monocromáticos, tríada, complementarios, separación complementaria, cuadrado, compuestos, tonos y personalizados. Estas reglas serán descritas en el siguiente apartado. 

Al seleccionar cualquiera de las reglas aparecen en el círculo cromático varios selectores o nodos. Al arrastrar cualquiera de ellos, el resto se desplaza de forma sincronizada manteniendo siempre la proporción y coherencia de la armonía elegida. En la parte inferior se visualizan, en tiempo real, los colores que intervienen en la paleta de color. De esta manera, la aplicación garantiza que los colores combinan entre ellos. 

Adobe Color es una interesante aplicación gratuita para que docentes sin experiencia en diseño gráfico creen paletas de color con suficiente contraste y en armonía.  

Imagen 5.16. Adobe Color. Círculo cromático y paletas de color

En el menú “explorar” se presentan diversas imágenes y paletas de color con la finalidad de buscar la inspiración en trabajos de otros diseñadores de la comunidad de Adobe. 

Tipos de armonías

En diseño, la armonía cromática es la combinación coherente de colores de manera que resulten equilibrados y visualmente agradables. Con la finalidad de comparar el efecto, se utiliza como ejemplo el mismo gráfico con una paleta de color adaptada al tipo de armonía elegido.


Armonía de análogos:

Combina colores que están próximos entre sí en el círculo cromático. Muy utilizada en materiales educativos porque produce sensación de unidad y equilibrio. En el ejemplo, se utilizan la gama de los verdes, azules verdosos y turquesa.

Imagen 5.17. Armonía de análogos (SUBDEVA) 

Armonía triádica:

Esta armonía utiliza tres colores equidistantes en el círculo cromático que forman un triángulo equilátero. Un ejemplo de armonía triádica son los colores azul, rojo y amarillo. Se utiliza en materiales educativos cuando se quiere diferenciar entre bloques de contenido o se precisa jerarquizar la información. Funciona mejor cuando un color domina y los otros dos actúan como secundarios.

Imagen 5.18. Armonía triádica (SUBDEVA) 

Armonía monocromática:

Utiliza un único tono variando la luminosidad y la saturación. En el ejemplo, se utilizan azul claro, azul medio y azul oscuro.

Imagen 5.19. Armonía monocromática (SUBDEVA)

 Armonía de complementarios:

Analogía que emplea colores situados en posiciones opuestas en el círculo cromático (colores complementarios). Tiene un alto contraste visual y se caracteriza por su capacidad para captar la atención por la fuerte diferenciación entre los colores. Algunos ejemplos son los colores rojo y verde; también azul y naranja. 

Imagen 5.20. Armonía de complementarios (SUBDEVA)

Armonía complementaria dividida:

A partir de un color principal, se seleccionan los dos tonos adyacentes a su complementario. En este caso, en lugar de elegir el complementario puro se seleccionan dos colores que están uno a cada lado. Ofrece un alto contraste, pero menos agresivo que el complementario directo.

Imagen 5.21. Armonía complementaria dividida (SUBDEVA) 

Armonía tetrádica o doble complementaria:

Es una combinación de 4 colores que son dos pares de complementarios y forman en el círculo cromático un rectángulo o un cuadrado. El ejemplo clásico lo forman el azul y el naranja, por un lado, y el rojo y el verde, por otro. La clave es elegir un color dominante y que los otros 3 actúen como secundarios.  Esta armonía tiene un alto contraste pero puede ser difícil de equilibrar; para suavizarla se suele utilizar un color neutro como el blanco o el gris.

Imagen 5.22. Armonía tetrádica (SUBDEVA) 

Armonía acromática:

Utiliza colores neutros como blanco, negro y grises. Transmite sobriedad, elegancia y minimalismo. 

Imagen 5.23. Armonía acromática (SUBDEVA)

Creado con eXeLearning (Ventana nueva)