Para las representaciones gráficas hemos escogido cinco gamas de colores armónicos (aquellos que funcionan bien juntos) y que permiten que la visualización de éstas sean agradables a la vista.

El uso adecuado del color en una página web es un aspecto de especial relevancia ya que contribuye a que la experiencia visual del usuario con la misma sea satisfactoria. 

En la siguiente tabla se muestran los códigos de los colores que hemos de utilizar en las series de datos; éstos se encuentran agrupados en cinco gamas (azul, marrón, verde, rojo y gris).

Los diferentes tonos a usar en las series de las gráficas se regirán por los siguientes criterios:

• Un sólo color: el color a utilizarse es el tono central del bloque azul [#5b94d7].
• Dos colores: se utilizaran los tonos centrales de los dos primeros bloques: ['#5b94d7', '#d7a35b',].
• Tres o más colores: podemos utilizar dos opciones:
  • Comenzar por el primer color del primer bloque y continuar en orden secuencial.
  • Utilizar colores de diferentes bloques, siempre que ocupen la misma posición en cada bloque.
• Opcional: en aquellos casos en los que en la entrada existan varias gráficas monocolor, puede alternarse el uso del color central del siguiente bloque y sucesivos.

Gráfica en la que utilizamos un sólo color [#5b94d7]:

Gráfica en la que utilizamos dos colores: [#5b94d7, #d7a35b]

Gráfica en la que se usan tres colores de distintos bloques: [#5b94d7, #d7a35b, #97d65a]

Gráfica en la que utilizamos tres colores de distintos bloques: [#5b94d7, #d7a35b, #97d65a]

Gráfica en la que utilizamos tres colores del mismo bloque: [#c9dbf1', #92b8e4, #5b94d7]

Gráfica en la que utilizamos siete colores: [#c9dbf1, #92b8e4, #5b94d7, #325f94, #1b3048, #f1dfc9, #e4c292]