Cómo definir colores en CSS
El estándar CSS ofrece distintas maneras para definir colores: por nombre, con notación hexadecimal o con notación decimal.
¿Cómo designar un color por su nombre?
HTML tiene un grupo de nombres para una cantidad limitada de colores (ver colores HTML). La cantidad de colores que ofrece HTML no alcanza para cubrir todas las necesidades; sin embargo, puede resultar muy práctico llamar a los colores por su nombre si son colores estándar.
El estándar CSS incluye 16 colores básicos ya definidos por HTML 4.01 y agrega el naranja. La lista de colores disponibles en CSS es la siguiente:
aqua | green | orange | white |
black | lime | purple | yellow |
blue | maroon | red | |
fuschia | navy | silver | |
gray | olive | teal |
Por lo tanto, para establecer los encabezados de nivel 1 en azul (blue), sólo se debe agregar una regla CSS como la siguiente:
h1 {color: blue}
En realidad, los navegadores admiten más de 140 nombres de colores, pero actualmente no todos forman parte del estándar CSS.
¿Cómo definir colores con el código RGB (rojo, verde, azul) en notación hexadecimal?
Pueden definirse más de 16 millones de colores al especificarse los valores RGB de un color con la notación #RRGGBB tomada de HTML, donde RR, GG y BB representan, cada uno, un número hexadecimal entre 00 y FF para rojo, verde y azul, respectivamente.
Ésta es la misma declaración que la anterior, pero con notación hexadecimal:
h1 {color: #0000FF}
¿Cómo definir colores con el código RGB (rojo, verde, azul) en notación decimal?
CSS también define una notación RGB "funcional" que se utiliza para establecer los valores rojo, verde y azul al indicar sus proporciones relativas en porcentaje o en números enteros positivos (cada valor puede ser un número entero entre 0 y 255) por medio de alguna de las siguientes sintaxis:
rgb(100%,100%,100%) rgb(24,125,255)