El modelo de color RGB lo usamos normalmente en muchas de las aplicaciones gráficas  asi como en otra aplicaciones de diseño web, pero a pesar de usarlo muy amenudo no es facil comprender como funciona. Conocerlo es muy practico para encontrar un color concreto que necesitemos, una paleta de color acorde entre si, o incluso una paleta monocromatica con más o menos luminosidad. A continuación encontrareis sencillas notaciones para conocer un poco más acerca de los colores HTML.

4


De entre todos los modelos de color que podemos encontrar, el usado en monitores y televisiones es el RGB (en español llamado RVA). Su paleta de color se basa en tres colores primarios, rojo verde y azul, y en sus posibles combinaciones, creando un espectro muy amplio. El sistema de nomenclatura es único para todos los formatos formados por tres pares de dígitos de esta forma: #RRGGBB,  siendo RR el correspondiente al rojo, el GG el correspondiente al verde y el BB el correspondiente al azul. A rasgos generales esos seis dígitos es la cantidad de cada color primario que contiene el color que hemos seleccionado. A este código lo llamaremos código hexadecimal, la ausencia de los tres colores indicaría el #000000 que es el color negro.

blog

EL código hexadecimal tiene su correspondiente en números enteros, llamado código decimal de colores. Más fácil de comprender que la anterior, pero menos útil ya que para diseñar es más practico el código hexadecimal. Esta otra nomenclatura utiliza desde el 0 al 255, siendo el cero el numero más bajo (y más aproximado al negro) y el 255 la saturación del color. De este modo obtendremos 3 números, cada uno correspondiente a uno de los colores primarios y siempre en el mismo orden rojo, verde y azul. Como ejemplo los colores primarios se designarían así:

2

Variando las tres cantidades de los colores primarios obtendríamos los diferentes colores de nuestra paleta. Entendido esto volvemos al sistema hexadecimal.

Este sistema es algo complicado de entender, ya que se basa en modelos matemáticos algo complejos. Para comprenderlo mejor, vamos a visualizar solo uno de los tres colores primarios, por ejemplo el rojo. Si no queremos que nuestro color contenta rojo, simplemente dejaremos el #00, el cero será la cifra más baja y aproximada al color negro.  Si aumentamos el color rojo hasta el #99, tendríamos más cantidad de color rojo, pero solo dispondríamos de 99 tipos de rojo diferentes, y como antes he explicado en el código decimal, el modelo de color RGB distingue 255 tipos de rojo diferentes.  El problema es que esta nomenclatura no deja más de 2 dígitos por color, así que no podíamos usar el #255 que representaría el rojo saturado. Por ello se han tomado letras en lugar de números, es decir, añadimos letras por valor 10, 11, 12,13, 14 y 15. De esta forma, la A=10, la B=11… y así hasta la F=15. La consecución de números es sencilla, después del #09 irá el #0A, #0B… #0F, #10, tomando la A como un valor numérico más. Así pues, el numero más alto que podemos encontrar seria el #FF, que indica la saturación de color, en nuestro caso el rojo. Aunque a priori es algo difícil de entender, es un sistema sencillo que con algo de practica no presenta dificultad.

3

Si nos fijamos, entre el color #00 y  el color #10 representaría ya 16 colores, esto indicaría que el color #FF seria el 256 (16×16=256), equivalente al color saturado del código decimal. La correspondencia entre códigos es ahora correcta. Como podemos ver, entre el color nulo y el saturado (#00 y #FF) podemos encontrar el color medio o mediano. Es el decimal 128, equivalente al hexadecimal #80 (8×16=128).

Si esto lo aplicamos ahora a los tres colores primarios, obtenemos que el color #FFFFFF es el color que tiene saturado el rojo, verde y azul, es decir, el blanco.

En esta web podéis verlo con más claridad así como probar los colores vosotros para ver de que forma varía. Si hacemos cuentas de cuantas combinaciones de colores son posibles, 256 por cada color primario, a tres colores primarios usados, dan un total de 16,777.256 colores (256x256x256) un número considerable de colores para usar. En otro post os explicaré los tipos de colores y combinaciones que debemos tener en cuenta para diseñar. Espero que este post os saque de dudas y os sea de utilidad.