Para las páginas html, los colores se denotan principalmente en sistema hexadecimal. Para esto, se utilizan dos tipos de registro de código: completo o abreviado. Para indicar correctamente el color html con un registro completo, debe escribir seis caracteres (números y/o letras inglesas) después del entramado, por ejemplo, el negro se escribe así: #000000. Una notación abreviada para especificar colores html consiste en una cuadrícula y tres números y/o letras detrás de ella. Al mismo tiempo, este tipo de reserva solo se puede usar si el registro completo de este color consta de los mismos caracteres después de la cuadrícula. Por ejemplo, el mismo color negro se puede escribir así: #000. Puede especificar colores html con caracteres grandes y pequeños, ya que no distinguen entre mayúsculas y minúsculas.
Cada carácter escrito después de "#" corresponde a una determinada proporción de colores rojo, verde y azul. A su vez, todos los monitores constan de una gran cantidad de píxeles (puntos microscópicos), cada uno de los cuales incluye 3 llamadas "linternas" (fuentes de luz): rojo, verde y azul. Luego, ajustando la intensidad de la luz emitida por estas "linternas", el monitor muestra el color que necesitamos.
Al combinar la intensidad de la luz roja, azul y verde (0 a 256), los monitores pueden mostrar 16,000,000 de colores diferentes.
Además, los colores de los sitios se pueden especificar verbalmente o en código RGB.
Hasta la fecha, verbalmente, puede prescribir 147 colores. Sin embargo, es importante saber que algunos nombres diferentes pueden referirse a los mismos colores, por ejemplo, Gray y Gray son grises (#808080).
No todos los monitores y navegadores pueden mostrar correctamente los 16 millones de colores html.
Si, por ejemplo, aparece un color que el navegador no puede mostrar correctamente, entonces:
Para asegurarse de que la salida en cualquier navegador y en cualquier monitor sea del color que especificó en el código, se recomienda usar " Colores seguros". No se determinaron manualmente o a pedido de alguien, sino matemáticamente. Hay 216 colores 100% seguros para documentos html. Y aunque las tecnologías actuales han llegado al punto en que los monitores y navegadores modernos reconocen millones de tonos, recomendamos garantizar color renderizado para usar estos colores seguros.
| Sistema de color hexadecimal. | Códigos de color en RGB (Rojo, Verde, Azul). |
| Código html de color: #000000 | Color RGB: 0 0 0 |
| Código html de color: #333333 | Color RGB: 51 51 51 |
| Código html de color: #666666 | Color RGB: 102 102 102 |
| Código html de color: #999999 | Color RGB: 153 153 153 |
| Código html de color: #CCCCCC | Color RGB: 204 204 204 |
| Código html de color: #FFFFFF | Color RGB: 255 255 255 |
| Código html de color: #666600 | Color RGB: 102 102 0 |
| Código html de color: #999900 | Color RGB: 153 153 0 |
| Código html de color: #999933 | Color RGB: 153 153 51 |
| Código html de color: #999966 | Color RGB: 153 153 102 |
| Código html de color: #CCCC33 | Color RGB: 204 204 51 |
| Código html de color: #CCCC66 | Color RGB: 204 204 102 |
| Código html de color: #333300 | Color RGB: 51 51 0 |
| Código html de color: #666633 | Color RGB: 102 102 51 |
| Código html de color: #CCCC99 | Color RGB: 204 204 153 |
| Código html de color: #CCFF33 | Color RGB: 204 255 51 |
| Código html de color: #CCFF00 | Color RGB: 204 255 0 |
| Código html de color: #CCFF66 | Color RGB: 204 255 102 |
| Código html de color: #669900 | Color RGB: 102 153 0 |
| Código html de color: #99CC33 | Color RGB: 153 204 51 |
| Código html de color: #99CC00 | Color RGB: 153 204 0 |
| Código html de color: #99CC66 | Color RGB: 153 204 102 |
| Código html de color: #99FF33 | Color RGB: 153 255 51 |
| Código html de color: #99FF00 | Color RGB: 153 255 0 |
| Código html de color: #336600 | Color RGB: 51 102 0 |
| Código html de color: #669933 | Color RGB: 102 153 51 |
| Código html de color: #66CC33 | Color RGB: 102 204 51 |
| Código html de color: #66CC00 | Color RGB: 102 204 0 |
| Código html de color: #99FF66 | Color RGB: 153 255 102 |
| Código html de color: #CCFF99 | Color RGB: 204 255 153 |
| Código html de color: #009900 | Color RGB: 0 153 0 |
| Código html de color: #339900 | Color RGB: 51 153 0 |
| Código html de color: #33CC00 | Color RGB: 51 204 0 |
| Código html de color: #33FF00 | Color RGB: 51 255 0 |
| Código html de color: #66FF33 | Color RGB: 102 255 51 |
| Código html de color: #66FF00 | Color RGB: 102 255 0 |
| Código html de color: #00CC33 | Color RGB: 0 204 51 |
| Código html de color: #33CC33 | Color RGB: 51 204 51 |
| Código html de color: #00CC00 | Color RGB: 0 204 0 |
| Código html de color: #00FF00 | Color RGB: 0 255 0 |
| Código html de color: #00FF33 | Color RGB: 0 255 51 |
| Código html de color: #33FF33 | Color RGB: 51 255 51 |
| Código html de color: #003300 | Color RGB: 0 51 0 |
| Código html de color: #336633 | Color RGB: 51 102 51 |
| Código html de color: #669966 | Color RGB: 102 153 102 |
| Código html de color: #66CC66 | Color RGB: 102 204 102 |
| Código html de color: #99CC99 | Color RGB: 153 204 153 |
| Código html de color: #CCFFCC | Color RGB: 204 255 204 |
| Código html de color: #006600 | Color RGB: 0 102 0 |
| Código html de color: #339933 | Color RGB: 51 153 51 |
| Código html de color: #00FF66 | Color RGB: 0 255 102 |
| Código html de color: #33FF66 | Color RGB: 51 255 102 |
| Código html de color: #66FF66 | Color RGB: 102 255 102 |
| Código html de color: #99FF99 | Color RGB: 153 255 153 |
| Código html de color: #009933 | Color RGB: 0 153 51 |
| Código html de color: #00CC66 | Color RGB: 0 204 102 |
| Código html de color: #33CC66 | Color RGB: 51 204 102 |
| Código html de color: #00FF99 | Color RGB: 0 255 153 |
| Código html de color: #33FF99 | Color RGB: 51 255 153 |
| Código html de color: #66FF99 | Color RGB: 102 255 153 |
| Código html de color: #006633 | Color RGB: 0 102 51 |
| Código html de color: #009966 | Color RGB: 0 153 102 |
| Código html de color: #339966 | Color RGB: 51 153 102 |
| Código html de color: #00CC99 | Color RGB: 0 204 153 |
| Código html de color: #33CC99 | Color RGB: 51 204 153 |
| Código html de color: #66CC99 | Color RGB: 102 204 153 |
| Código html de color: #009999 | Color RGB: 0 153 153 |
| Código html de color: #33CCCC | Color RGB: 51 204 204 |
| Código html de color: #00FFCC | Color RGB: 0 255 204 |
| Código html de color: #33FFCC | Color RGB: 51 255 204 |
| Código html de color: #66FFCC | Color RGB: 102 255 204 |
| Código html de color: #99FFCC | Color RGB: 153 255 204 |
| Código html de color: #00CCCC | Color RGB: 0 204 204 |
| Código html de color: #00FFFF | Color RGB: 0 255 255 |
| Código html de color: #33FFFF | Color RGB: 51 255 255 |
| Código html de color: #66FFFF | Color RGB: 102 255 255 |
| Código html de color: #99FFFF | Color RGB: 153 255 255 |
| Código html de color: #CCFFFF | Color RGB: 204 255 255 |
| Código html de color: #336666 | Color RGB: 51 102 102 |
| Código html de color: #006666 | Color RGB: 0 102 102 |
| Código html de color: #669999 | Color RGB: 102 153 153 |
| Código html de color: #339999 | Color RGB: 51 153 153 |
| Código html de color: #66CCCC | Color RGB: 102 204 204 |
| Código html de color: #99CCCC | Color RGB: 153 204 204 |
| Código html de color: #003333 | Color RGB: 0 51 51 |
| Código html de color: #0099CC | Color RGB: 0 153 204 |
| Código html de color: #3399CC | Color RGB: 51 153 204 |
| Código html de color: #00CCFF | Color RGB: 0 204 255 |
| Código html de color: #33CCFF | Color RGB: 51 204 255 |
| Código html de color: #66CCFF | Color RGB: 102 204 255 |
| Código html de color: #006699 | Color RGB: 0 102 153 |
| Código html de color: #336699 | Color RGB: 51 102 153 |
| Código html de color: #6699CC | Color RGB: 102 153 204 |
| Código html de color: #0099FF | Color RGB: 0 153 255 |
| Código html de color: #3399FF | Color RGB: 51 153 255 |
| Código html de color: #99CCFF | Color RGB: 153 204 255 |
| Código html de color: #003366 | Color RGB: 0 51 102 |
| Código html de color: #003399 | Color RGB: 0 51 153 |
| Código html de color: #0033FF | Color RGB: 0 51 255 |
| Código html de color: #3366CC | Color RGB: 51 102 204 |
| Código html de color: #0066CC | Color RGB: 0 102 204 |
| Código html de color: #0066FF | Color RGB: 0 102 255 |
| Código html de color: #000033 | Color RGB: 0 0 51 |
| Código html de color: #0033CC | Color RGB: 0 51 204 |
| Código html de color: #0000CC | Color RGB: 0 0 204 |
| Código html de color: #0000FF | Color RGB: 0 0 255 |
| Código html de color: #3366FF | Color RGB: 51 102 255 |
| Código html de color: #6699FF | Color RGB: 102 153 255 |
| Código html de color: #000066 | Color RGB: 0 0 102 |
| Código html de color: #000099 | Color RGB: 0 0 153 |
| Código html de color: #3333CC | Color RGB: 51 51 204 |
| Código html de color: #3300CC | Color RGB: 51 0 204 |
| Código html de color: #3300FF | Color RGB: 51 0 255 |
| Código html de color: #3333FF | Color RGB: 51 51 255 |
| Código html de color: #333366 | Color RGB: 51 51 102 |
| Código html de color: #333399 | Color RGB: 51 51 153 |
| Código html de color: #666699 | Color RGB: 102 102 153 |
| Código html de color: #6666CC | Color RGB: 102 102 204 |
| Código html de color: #6666FF | Color RGB: 102 102 255 |
| Código html de color: #9999CC | Color RGB: 153 153 204 |
| Código html de color: #330066 | Color RGB: 51 0 102 |
| Código html de color: #330099 | Color RGB: 51 0 153 |
| Código html de color: #6600FF | Color RGB: 102 0 255 |
| Código html de color: #6633FF | Color RGB: 102 51 255 |
| Código html de color: #9999FF | Color RGB: 153 153 255 |
| Código html de color: #CCCCFF | Color RGB: 204 204 255 |
| Código html de color: #330033 | Color RGB: 51 0 51 |
| Código html de color: #663399 | Color RGB: 102 51 153 |
| Código html de color: #6633CC | Color RGB: 102 51 204 |
| Código html de color: #6600CC | Color RGB: 102 0 204 |
| Código html de color: #9966FF | Color RGB: 153 102 255 |
| Código html de color: #9966CC | Color RGB: 153 102 204 |
| Código html de color: #663366 | Color RGB: 102 51 102 |
| Código html de color: #660099 | Color RGB: 102 0 153 |
| Código html de color: #9900FF | Color RGB: 153 0 255 |
| Código html de color: #9933FF | Color RGB: 153 51 255 |
| Código html de color: #9933CC | Color RGB: 153 51 204 |
| Código html de color: #CC99FF | Color RGB: 204 153 255 |
| Código html de color: #660066 | Color RGB: 102 0 102 |
| Código html de color: #996699 | Color RGB: 153 102 153 |
| Código html de color: #9900CC | Color RGB: 153 0 204 |
| Código html de color: #CC00FF | Color RGB: 204 0 255 |
| Código html de color: #CC33FF | Color RGB: 204 51 255 |
| Código html de color: #CC66FF | Color RGB: 204 102 255 |
| Código html de color: #993399 | Color RGB: 153 51 153 |
| Código html de color: #990099 | Color RGB: 153 0 153 |
| Código html de color: #CC33CC | Color RGB: 204 51 204 |
| Código html de color: #CC00CC | Color RGB: 204 0 204 |
| Código html de color: #CC66CC | Color RGB: 204 102 204 |
| Código html de color: #CC99CC | Color RGB: 204 153 204 |
| Código html de color: #CC3399 | Color RGB: 204 51 153 |
| Código html de color: #FF00FF | Color RGB: 255 0 255 |
| Código html de color: #FF33FF | Color RGB: 255 51 255 |
| Código html de color: #FF66FF | Color RGB: 255 102 255 |
| Código html de color: #FF99FF | Color RGB: 255 153 255 |
| Código html de color: #FFCCFF | Color RGB: 255 204 255 |
| Código html de color: #990066 | Color RGB: 153 0 102 |
| Código html de color: #CC0099 | Color RGB: 204 0 153 |
| Código html de color: #CC6699 | Color RGB: 204 102 153 |
| Código html de color: #FF33CC | Color RGB: 255 51 204 |
| Código html de color: #FF00CC | Color RGB: 255 0 204 |
| Código html de color: #FF66CC | Color RGB: 255 102 204 |
| Código html de color: #660033 | Color RGB: 102 0 51 |
| Código html de color: #993366 | Color RGB: 153 51 102 |
| Código html de color: #CC0066 | Color RGB: 204 0 102 |
| Código html de color: #FF0099 | Color RGB: 255 0 153 |
| Código html de color: #FF3399 | Color RGB: 255 51 153 |
| Código html de color: #FF99CC | Color RGB: 255 153 204 |
| Código html de color: #663333 | Color RGB: 102 51 51 |
| Código html de color: #996666 | Color RGB: 153 102 102 |
| Código html de color: #CC3366 | Color RGB: 204 51 102 |
| Código html de color: #FF0066 | Color RGB: 255 0 102 |
| Código html de color: #FF3366 | Color RGB: 255 51 102 |
| Código html de color: #FF6699 | Color RGB: 255 102 153 |
| Código html de color: #330000 | Color RGB: 51 0 0 |
| Código html de color: #990033 | Color RGB: 153 0 51 |
| Código html de color: #993333 | Color RGB: 153 51 51 |
| Código html de color: #CC3333 | Color RGB: 204 51 51 |
| Código html de color: #CC6666 | Color RGB: 204 102 102 |
| Código html de color: #CC9999 | Color RGB: 204 153 153 |
| Código html de color: #CC0033 | Color RGB: 204 0 51 |
| Código html de color: #FF0033 | Color RGB: 255 0 51 |
| Código html de color: #FF3333 | Color RGB: 255 51 51 |
| Código html de color: #FF6666 | Color RGB: 255 102 102 |
| Código html de color: #FF9999 | Color RGB: 255 153 153 |
| Código html de color: #FFCCCC | Color RGB: 255 204 204 |
| Código html de color: #990000 | Color RGB: 153 0 0 |
| Código html de color:#CC0000 | Color RGB: 204 0 0 |
| Código html de color: #FF0000 | Color RGB: 255 0 0 |
| Código html de color: #FF3300 | Color RGB: 255 51 0 |
| Código html de color: #CC3300 | Color RGB: 204 51 0 |
| Código html de color: #FF6633 | Color RGB: 255 102 51 |
| Código html de color: #660000 | Color RGB: 102 0 0 |
| Código html de color: #993300 | Color RGB: 153 51 0 |
| Código html de color: #CC6633 | Color RGB: 204 102 51 |
| Código html de color: #FF6600 | Color RGB: 255 102 0 |
| Código html de color: #FF9966 | Color RGB: 255 153 102 |
| Código html de color: #FFCC99 | Color RGB: 255 204 153 |
| Código html de color: #663300 | Color RGB: 102 51 0 |
| Código html de color: #996633 | Color RGB: 153 102 51 |
| Código html de color: #CC6600 | Color RGB: 204 102 0 |
| Código html de color: #CC9966 | Color RGB: 204 153 102 |
| Código html de color: #FF9933 | Color RGB: 255 153 51 |
| Código html de color: #FF9900 | Color RGB: 255 153 0 |
| Código html de color: #996600 | Color RGB: 153 102 0 |
| Código html de color: #CC9933 | Color RGB: 204 153 51 |
| Código html de color: #CC9900 | Color RGB: 204 153 0 |
| Código html de color: #FFCC33 | Color RGB: 255 204 51 |
| Código html de color: #FFCC00 | Color RGB: 255 204 0 |
| Código html de color: #FFCC66 | Color RGB: 255 204 102 |
| Código html de color: #CCCC00 | Color RGB: 204 204 0 |
| Código html de color: #FFFF00 | Color RGB: 255 255 0 |
| Código html de color: #FFFF33 | Color RGB: 255 255 51 |
| Código html de color: #FFFF66 | Color RGB: 255 255 102 |
| Código html de color: #FFFF99 | Color RGB: 255 255 153 |
| Código html de color: #FFFFCC | Color RGB: 255 255 204 |
Esta tabla incluye 216 códigos de colores html seguros. Cada color tiene un valor en RGB para especificar el color en editores gráficos y HEX para especificar el color en páginas html.
Desafortunadamente, aún no es posible mostrar sensaciones gustativas en el sitio. Pero esto se puede compensar completamente con la ayuda de los colores. Después de todo, los colores html le permiten mostrar cualquiera de los millones de tonos. De modo que " lápices de colores” en su conjunto es mucho más que siete.
En html, el color se puede especificar en varios formatos:
1. Como valor hexadecimal: se utiliza el código especificado en el sistema hexadecimal. Dichos códigos de color en html consisten en tres pares de números hexadecimales. Cada par es responsable de la saturación de la tonalidad con su color primario:
Al comienzo del código (antes de los números), se coloca una marca hash. Este es el código de color hexadecimal. Además de los números del 1 al 9, este sistema numérico utiliza letras del alfabeto latino (A, B, C, D, E, F).
Por ejemplo, el código de color blanco en html se vería como #FFFFFF:
2. Palabra clave: en este momento, html admite alrededor de 147 palabras clave. Pero no todas estas palabras son únicas. Algunos de ellos se refieren al mismo tono de color.
El gris está representado por dos palabras clave: gris y gris. Su código hexadecimal (HEX) viene dado por el mismo valor #808080.
Ejemplo :
#808080
3. En formato RGB: esta codificación de color en html se basa en el uso de tres valores establecidos en el rango de 0 a 255. Cada uno de ellos determina la saturación del tono con uno de los colores primarios:
El número de color en formato RGB se escribe de la siguiente manera: rgb(0, 210, 100).
color de fondo: rgb (100,186,43)
4. En formato RGBA: es un formato RGB avanzado, donde el cuarto valor especifica la transparencia del color en forma de fracción decimal de 0 a 1.
Ejemplo de uso:
color de fondo:rgba(100,86,143,0.2)
color de fondo:rgba(100,86,143,0.5)
color de fondo:rgba(100,86,143,0.8)
color de fondo:rgba(100,86,143,1)
Con una gama tan amplia de formatos de configuración de color, es fácil confundirse. Por lo tanto, se inventó una tabla de colores especial. En él, a 147 nombres clave de tonos de color, se dan códigos de correspondencia en todos los estándares principales para la representación del color. Además, cada campo está equipado con una barra para la coincidencia visual de colores. Una de estas tablas se presenta en el sitio colorscheme.ru:
Pero incluso con la ayuda de tal estructuración de la correspondencia, la selección del tono deseado puede ser difícil. Y no es un hecho que haya el correcto en la tabla de códigos de color.
Para sortear esta barrera y facilitar al máximo la selección del tono adecuado, se han desarrollado servicios web interactivos. Su interfaz de usuario puede diferir ligeramente entre sí.
En el sitio html-color-codes.info, el generador de color se ve así:
Y dentro del servicio color-picker.appsmaster.co, esta herramienta se implementa de manera un poco diferente:
La saturación de cada color en el generador se establece mediante controles deslizantes especiales. Visualmente, el tono se muestra por el color del marco y el rectángulo en el lado izquierdo. En la parte inferior, 3 campos muestran el código de color en los formatos principales.
Pero el generador de colores no solo está disponible en sitios especializados. Casi todos los editores gráficos están equipados con una herramienta similar. Por ejemplo, Photoshop:
Y fue hace mucho tiempo, en la era de las tarjetas de video que solo admiten 256 colores. En aquellos tiempos lejanos Sistemas operativos podía mostrar solo un cierto número de sombras de ocho bits sin distorsión.
Entonces se crió la gran mesa de colores seguros. Indicaba 216 tonos que podían visualizarse sin distorsión en cualquiera de los navegadores de la época. Y hasta el día de hoy este gran manuscrito» todavía está disponible en algunos recursos:
Todo ha cambiado en nuestro tiempo. Por lo tanto, todas las reglas de seguridad al trabajar con color en html se cancelan por completo. Después de todo, el hardware informático moderno admite más de 16 millones de tonos diferentes. Y 216 colores seguros se han hundido en el olvido.
Estos datos están totalmente respaldados por las estadísticas. A juzgar por esto, en 2014 solo el 0,5% de los usuarios tienen computadoras que admiten solo 256 tonos.
No todos estamos dotados de un sentido del gusto natural y armonioso. Por lo tanto, elegir el color correcto puede ser un verdadero desafío. Pero, alabanza a la ciencia, incluso logró describir la armonía del color en forma de varios esquemas. Todos ellos se basan en el uso de la rueda de colores. Esquemas de selección armoniosa de colores en html.
Como sabes, el color puede afectar el estado de una persona: tanto mental como físico. Cada día, navegando por Internet, los ojos evalúan millones de colores y matices. Un diseñador web que esté familiarizado con la psicología del color puede controlar el estado de ánimo del visitante para lograr cualquier objetivo.
Esto se debe al hecho de que algunos tonos calman y otros, por el contrario, excitan. A continuación, hablaremos sobre cómo se sintetiza y muestra el color utilizando tecnología informática.
RGB es un modelo de color que representa un método para obtener todos los colores y sus matices mezclando en varias proporciones los tres componentes principales, que son:
De aquí proviene el nombre abreviado RGB. Estos colores se eligen como los principales por una razón: la razón es la fisiología de la retina del ojo humano, y cómo los percibe:
El modelo RGB es, con diferencia, el más popular y se utiliza para reproducir colores en pantallas de televisión y monitores de ordenador. Dado que los fabricantes dotan a sus productos de diferentes características, en 1996 se creó un sistema unificado de síntesis de color basado en RGB denominado sRGB, en el que trabajaron conjuntamente Microsoft y HP.
Como se mencionó anteriormente, los colores RGB se forman mezclando colores primarios. Para describir la intensidad de cada uno de ellos se adoptó un esquema en el que el color está representado por el rango 0-255 (8 bits), que corresponde a 00-FF en hexadecimal.
Es decir, los colores primarios se verán así:
Si la intensidad del color toma valores inferiores a 255, se obtienen varios tonos de rojo, verde y azul. A continuación se muestra una tabla de su gradación, así como los valores hexadecimales de cada una de las tonalidades:
Naturalmente, además de las gradaciones de colores primarios, hay mezclas y su número es bastante grande. Por ello, se creó una tabla de colores RGB, que presenta todos los matices existentes, así como sus nombres y representaciones numéricas ( en forma decimal y hexadecimal).
Puedes conocerla aquí. Esta tabla facilita mucho la vida de los diseñadores web, ya que en unos segundos puede encontrar el tono deseado y conocer su representación numérica.
Sin embargo, en algún momento hubo un problema de visualización de colores en diferentes navegadores, y para solucionarlo, se compiló la llamada paleta "segura" de colores RGB, que se derivaron de cálculos matemáticos.
Cuando el navegador no puede mostrar un color correctamente, intenta acercarse a lo que necesita mezclando colores vecinos, y lo más probable es que el resultado sea completamente inaceptable:
Al utilizar los códigos de color RGB de esta paleta, un desarrollador web puede tener la tranquilidad de mostrar colores en las páginas de su sitio cuando se visualizan con diferentes navegadores, plataformas y monitores. Aunque de momento la tabla de colores seguros va perdiendo relevancia ( el progreso tecnológico no se detiene), al usarlo, puedes, como dicen, dormir tranquilo.
Por primera vez, la palabra "oro" se utilizó a principios del siglo XIV para describir el color de un elemento químico llamado Aurum: oro. En el modelo RGB, el color dorado está representado por los siguientes valores numéricos:
Beige toma bastante lugar significativo en la historia, aunque no sea la más expresiva. Muchos monumentos culturales, especialmente esculturas antiguas, estaban hechos de esteatita y esteatita, que tienen un tinte beige. En el modelo RGB, el beige tiene las siguientes representaciones numéricas.
Los colores HTML se indican con seis caracteres después de la barra, por ejemplo, #000000. Estos seis caracteres representan las proporciones de los distintos colores (rojo, verde y azul) en el color final. La imagen en el monitor de su computadora se compone de una gran cantidad de puntos llamados píxeles. Cada píxel es una pequeña fuente de luz, llamémoslo "linterna", que a su vez consta de tres linternas: roja, verde y azul. Al reducir o aumentar la intensidad del brillo de las linternas de colores individuales, obtenemos el color deseado.
Los colores en HTML se indican mediante la notación hexadecimal (HEX) para la combinación de rojo, azul y verde (RGB).
El valor de color más pequeño es 0 (hexadecimal 00). El valor de color más alto es 255 (FF hexadecimal).
El valor de color hexadecimal es de tres dígitos que comienzan con #.
Códigos de colores (valores)
| Color | código hexadecimal | código RGB |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #FF0000 | rgb(255,0,0) | |
| #00FF00 | rgb(0,255,0) | |
| #0000FF | rgb(0,0,255) | |
| #FFFF00 | rgb(255,255,0) | |
| #00FFFF | rgb(0,255,255) | |
| #FF00FF | rgb(255,0,255) | |
| #C0C0C0 | rgb(192,192,192) | |
| #FFFFFF | rgb(255,255,255) |
Combinar rojo, azul y verde con valores que van de 0 a 255 para cada color suma más de 16 millones de tonos (256 x 256 x 256).
Mayoría monitores modernos capaz de mostrar al menos 16384 tonos diferentes (los monitores LCD son principalmente capaces de mostrar 262 mil 16 millones (actualizado en octubre de 2013) colores, mientras que los monitores CRT pueden mostrar una cantidad casi ilimitada de colores).
La siguiente tabla de colores muestra el cambio en la proporción de rojo de 0 a 255 con valores cero para azul y verde:
| Rojo | código hexadecimal | código RGB |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #080000 | rgb(8,0,0) | |
| #100000 | rgb(16,0,0) | |
| #180000 | rgb(24,0,0) | |
| #200000 | rgb(32,0,0) | |
| #280000 | rgb(40,0,0) | |
| #300000 | rgb(48,0,0) | |
| #380000 | rgb(56,0,0) | |
| #400000 | rgb(64,0,0) | |
| #480000 | rgb(72,0,0) | |
| #500000 | rgb(80,0,0) | |
| #580000 | rgb(88,0,0) | |
| #600000 | rgb(96,0,0) | |
| #680000 | rgb(104,0,0) | |
| #700000 | rgb(112,0,0) | |
| #780000 | rgb(120,0,0) | |
| #800000 | rgb(128,0,0) | |
| #880000 | rgb(136,0,0) | |
| #900000 | rgb(144,0,0) | |
| #980000 | rgb(152,0,0) | |
| #A00000 | rgb(160,0,0) | |
| #A80000 | rgb(168,0,0) | |
| #B00000 | rgb(176,0,0) | |
| #B80000 | rgb(184,0,0) | |
| #C00000 | rgb(192,0,0) | |
| #C80000 | rgb(200,0,0) | |
| #D00000 | rgb(208,0,0) | |
| #D80000 | rgb(216,0,0) | |
| #E00000 | rgb(224,0,0) | |
| #E80000 | rgb(232,0,0) | |
| #F00000 | rgb(240,0,0) | |
| #F80000 | rgb(248,0,0) | |
| #FF0000 | rgb(255,0,0) |
Para obtener tonos de gris, se utilizan proporciones iguales de todos los colores. Para facilitar la elección del color deseado, ponemos a su disposición códigos de tonos de gris.
| sombras de gris | código hexadecimal | código RGB |
|---|---|---|
| #000000 | rgb(0,0,0) | |
| #080808 | rgb(8,8,8) | |
| #101010 | rgb(16,16,16) | |
| #181818 | rgb(24,24,24) | |
| #202020 | rgb(32,32,32) | |
| #282828 | rgb(40,40,40) | |
| #303030 | rgb(48,48,48) | |
| #383838 | rgb(56,56,56) | |
| #404040 | rgb(64,64,64) | |
| #484848 | rgb(72,72,72) | |
| #505050 | rgb(80,80,80) | |
| #585858 | rgb(88,88,88) | |
| #606060 | rgb(96,96,96) | |
| #686868 | rgb(104,104,104) | |
| #707070 | rgb(112,112,112) | |
| #787878 | rgb(120,120,120) | |
| #808080 | rgb(128,128,128) | |
| #888888 | rgb(136,136,136) | |
| #909090 | rgb(144,144,144) | |
| #989898 | rgb(152,152,152) | |
| #A0A0A0 | rgb(160,160,160) | |
| #A8A8A8 | rgb(168,168,168) | |
| #B0B0B0 | rgb(176,176,176) | |
| #B8B8B8 | rgb(184,184,184) | |
| #C0C0C0 | rgb(192,192,192) | |
| #C8C8C8 | rgb(200,200,200) | |
| #D0D0D0 | rgb(208,208,208) | |
| #D8D8D8 | rgb(216,216,216) | |
| #E0E0E0 | rgb(224,224,224) | |
| #E8E8E8 | rgb(232,232,232) | |
| #F0F0F0 | rgb(240,240,240) | |
| #F8F8F8 | rgb(248,248,248) | |
| #FFFFFF | rgb(255,255,255) |
Una colección de 150 nombres de colores html compatibles con todos los navegadores.
El W3C enumera 16 nombres de colores válidos para HTML y CSS: aqua (aguamarina), negro (negro), azul (azul), fucsia (magenta), gris (gris), verde (verde), lima (lima o verde claro), granate (castaño), azul marino (ultramar), verde oliva (oliva), morado (púrpura), rojo (rojo), plata (plata), verde azulado (gris), blanco (blanco) y amarillo (amarillo).
Cuando se utilicen colores que no estén incluidos en esta lista, será más correcto utilizar su código hexadecimal (HEX) o su código RGB.
Hace algunos años, cuando las computadoras podían admitir un máximo de 256 colores diferentes, se propuso una lista de 216 "Colores seguros para la Web", con 40 colores reservados para el sistema.
Esta paleta de 216 colores se creó para mostrar correctamente los colores en el modo de paleta de 256 colores.
No importa ahora porque la mayoría de las computadoras en todo el mundo admiten millones de tonos de color. En cualquier caso, aquí hay una lista de esos colores:
| 000000 | 000033 | 000066 | 000099 | 0000CC | 0000FF |
| 003300 | 003333 | 003366 | 003399 | 0033CC | 0033FF |
| 006600 | 006633 | 006666 | 006699 | 0066CC | 0066FF |
| 009900 | 009933 | 009966 | 009999 | 0099CC | 0099FF |
| 00CC00 | 00CC33 | 00CC66 | 00CC99 | 00CCCC | 00CCFF |
| 00FF00 | 00FF33 | 00FF66 | 00FF99 | 00FFCC | 00FFFF |
| 330000 | 330033 | 330066 | 330099 | 3300CC | 3300FF |
| 333300 | 333333 | 333366 | 333399 | 3333CC | 3333FF |
| 336600 | 336633 | 336666 | 336699 | 3366CC | 3366FF |
| 339900 | 339933 | 339966 | 339999 | 3399CC | 3399FF |
| 33CC00 | 33CC33 | 33CC66 | 33CC99 | 33CCCC | 33CCFF |
| 33FF00 | 33FF33 | 33FF66 | 33FF99 | 33FFCC | 33FFFF |
| 660000 | 660033 | 660066 | 660099 | 6600CC | 6600FF |
| 663300 | 663333 | 663366 | 663399 | 6633CC | 6633FF |
| 666600 | 666633 | 666666 | 666699 | 6666CC | 6666FF |
| 669900 | 669933 | 669966 | 669999 | 6699CC | 6699FF |
| 66CC00 | 66CC33 | 66CC66 | 66CC99 | 66CCCC | 66CCFF |
| 66FF00 | 66FF33 | 66FF66 | 66FF99 | 66FFCC | 66FFFF |
| 990000 | 990033 | 990066 | 990099 | 9900CC | 9900FF |
| 993300 | 993333 | 993366 | 993399 | 9933CC | 9933FF |
| 996600 | 996633 | 996666 | 996699 | 9966CC | 9966FF |
| 999900 | 999933 | 999966 | 999999 | 9999CC | 9999FF |
| 99CC00 | 99CC33 | 99CC66 | 99CC99 | 99CCCC | 99CCFF |
| 99FF00 | 99FF33 | 99FF66 | 99FF99 | 99FFCC | 99FFFF |
| CC0000 | CC0033 | CC0066 | CC0099 | CC00CC | CC00FF |
| CC3300 | CC3333 | CC3366 | CC3399 | CC33CC | CC33FF |
| CC6600 | CC6633 | CC6666 | CC6699 | CC66CC | CC66FF |
| CC9900 | CC9933 | CC9966 | CC9999 | CC99CC | CC99FF |
| CCCC00 | CCCC33 | CCCC66 | CCCC99 | CCCCCC | CCCCFF |
| CCFF00 | CCFF33 | CCFF66 | CCFF99 | CCFFCC | CCFFFF |
| FF0000 | FF0033 | FF0066 | FF0099 | FF00CC | FF00FF |
| FF3300 | FF3333 | FF3366 | FF3399 | FF33CC | FF33FF |
| FF6600 | FF6633 | FF6666 | FF6699 | FF66CC | FF66FF |
| FF9900 | FF9933 | FF9966 | FF9999 | FF99CC | FF99FF |
| FFCC00 | FFCC33 | FFCC66 | FFCC99 | FFCCCC | FFCCFF |
| FFFF00 | FFFF33 | FFFF66 | FFFF99 | FFFFCC | FFFFFF |
En HTML, el color se puede especificar de tres formas:
Algunos colores se pueden especificar por su nombre, usando el nombre del color en la idioma en Inglés. Las palabras clave más comunes: negro (negro), blanco (blanco), rojo (rojo), verde (verde), azul (azul), etc.:
Color del texto: rojo
Los colores más populares del estándar World Wide Web Consortium (W3C) son:
| Color | Nombre | Color | Nombre | Color | Nombre | Color | Nombre |
|---|---|---|---|---|---|---|---|
| Negro | Gris | Plata | Blanco | ||||
| Amarillo | Lima | Agua | Fucsia | ||||
| Rojo | Verde | Azul | Violeta | ||||
| granate | Aceituna | Armada | verde azulado |
Un ejemplo del uso de diferentes nombres de colores:
Cuando se muestran diferentes colores en el monitor, se toma como base la paleta RGB. Cualquier color se obtiene mezclando los tres principales: R - rojo, G - verde (verde), B - azul (azul). El brillo de cada color viene dado por un byte y, por lo tanto, puede tomar valores de 0 a 255. Por ejemplo, RGB (255,0,0) se representa como rojo porque el rojo está configurado en su valor más alto (255) y el el resto se establece en 0. También puede establecer el color como un porcentaje. Cada uno de los parámetros indica el nivel de brillo del color correspondiente. Por ejemplo: los valores rgb(127, 255, 127) y rgb(50%, 100%, 50%) configurarán el mismo color verde de saturación media:
Valores R GRAMO B también se puede especificar usando valores de color hexadecimales (HEX) en la forma: #RRGGBB donde RR (rojo), GG (verde) y BB (azul) son valores hexadecimales de 00 a FF (igual que decimal 0- 255). El sistema hexadecimal, a diferencia del sistema decimal, se basa, como su nombre lo indica, en el número 16. El sistema hexadecimal utiliza los siguientes caracteres: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Aquí los números del 10 al 15 se sustituyen por letras latinas. Los números mayores de 15 en el sistema hexadecimal son la unión de dos caracteres en un solo valor. Por ejemplo, el número más alto 255 en decimal corresponde al FF más alto en hexadecimal. A diferencia del sistema decimal, el número hexadecimal está precedido por un signo de libra. # , por ejemplo, #FF0000 se muestra como rojo porque el rojo está configurado en su valor más alto (FF) y los demás colores están configurados en su valor mínimo (00). Caracteres después del símbolo hash # se puede escribir tanto en mayúsculas como en minúsculas. El sistema hexadecimal te permite usar la forma abreviada #rgb, donde cada carácter es igual a dos veces. Por lo tanto, la entrada #f7O debe considerarse como #ff7700.
Lista de colores de uso común (nombre, HEX y RGB):
| nombre inglés | nombre ruso | Muestra | MALEFICIO | RGB | ||
|---|---|---|---|---|---|---|
| Amaranto | amaranto | #E52B50 | 229 | 43 | 80 | |
| Ámbar | Ámbar | #FFBF00 | 255 | 191 | 0 | |
| Agua | azul verde | #00FFFF | 0 | 255 | 255 | |
| Azur | Azur | #007FFF | 0 | 127 | 255 | |
| Negro | Negro | #000000 | 0 | 0 | 0 | |
| Azul | Azul | #0000FF | 0 | 0 | 255 | |
| Bondi Azul | Agua de la playa de Bondi | #0095B6 | 0 | 149 | 182 | |
| Latón | Latón | #B5A642 | 181 | 166 | 66 | |
| Marrón | Marrón | #964B00 | 150 | 75 | 0 | |
| Azul claro | Azur | #007BA7 | 0 | 123 | 167 | |
| verde primavera oscuro | Verde primavera oscuro | #177245 | 23 | 114 | 69 | |
| Esmeralda | Esmeralda | #50C878 | 80 | 200 | 120 | |
| Berenjena | berenjena | #990066 | 153 | 0 | 102 | |
| Fucsia | Fucsia | #FF00FF | 255 | 0 | 255 | |
| Oro | Oro | #FFD700 | 250 | 215 | 0 | |
| Gris | Gris | #808080 | 128 | 128 | 128 | |
| Verde | Verde | #00FF00 | 0 | 255 | 0 | |
| Índigo | Índigo | #4B0082 | 75 | 0 | 130 | |
| Jade | Jade | #00A86B | 0 | 168 | 107 | |
| Lima | Lima | #CCFF00 | 204 | 255 | 0 | |
| Malaquita | Malaquita | #0BDA51 | 11 | 218 | 81 | |
| Armada | Azul oscuro | #000080 | 0 | 0 | 128 | |
| Ocre | Ocre | #CC7722 | 204 | 119 | 34 | |
| Aceituna | Aceituna | #808000 | 128 | 128 | 0 | |
| Naranja | Naranja | #FFA500 | 255 | 165 | 0 | |
| durazno | Durazno | #FFE5B4 | 255 | 229 | 180 | |
| Calabaza | Calabaza | #FF7518 | 255 | 117 | 24 | |
| Violeta | Violeta | #800080 | 128 | 0 | 128 | |
| Rojo | Rojo | #FF0000 | 255 | 0 | 0 | |
| Azafrán | Azafrán | #F4C430 | 244 | 196 | 48 | |
| verde mar | Mar verde | #2E8B57 | 46 | 139 | 87 | |
| verde pantano | Bolotni | #ACB78E | 172 | 183 | 142 | |
| verde azulado | azul verde | #008080 | 0 | 128 | 128 | |
| Ultramarino | ultramarino | #120A8F | 18 | 10 | 143 | |
| Violeta | Violeta | #8B00FF | 139 | 0 | 255 | |
| Amarillo | Amarillo | #FFFF00 | 255 | 255 | 0 | |
Códigos de color (fondo) por saturación y tonalidad.
