CSS usa valores de color para especificar un color. Por lo general, se utilizan para establecer un color para el primer plano de un elemento (es decir, su texto) o para el fondo del elemento. También se pueden usar para modificar el color de los bordes y otros efectos decorativos.
Puede especificar sus valores de color en varios formatos. La siguiente tabla enumera todos los formatos posibles:
| Formato | Sintaxis | Ejemplo |
|---|---|---|
| código hexadecimal | #RRGGBB | p{color: #FF0000;} |
| Código hexadecimal corto | #RGB | p{color: #6A7;} |
| RGB% | rgb(rrr%,ggg%,bbb%) | p{color: rgb(50%,50%,50%);} |
| RGB absoluto | RGB (rrr, ggg, bbb) | p{color: rgb(0,0,255);} |
| palabra clave | agua, negro, etc | p{color: verde azulado;} |
Estos formatos se explican con más detalle en las siguientes secciones:
Colores CSS – Códigos hexadecimales
Un hexadecimal es una representación de 6 dígitos de un color. Los dos primeros dígitos (RR) representan un valor rojo, los dos siguientes son un valor verde (GG) y el último es el valor azul (BB).
Se puede tomar un valor hexadecimal de cualquier software de gráficos como Adobe Photoshop, Jasc Paintshop Pro o incluso usando Advanced Paint Brush.
Cada código hexadecimal estará precedido por un signo de libra o almohadilla ‘#’. Los siguientes son ejemplos para usar la notación hexadecimal.
| Color | Color HEXAGONAL |
|---|---|
| #000000 | |
| #FF0000 | |
| #00FF00 | |
| #0000FF | |
| #FFFF00 | |
| #00FFFF | |
| #FF00FF | |
| #C0C0C0 | |
| #FFFFFF |
Colores CSS – Códigos hexadecimales cortos
Esta es una forma más corta de la notación de seis dígitos. En este formato, cada dígito se replica para llegar a un valor equivalente de seis dígitos. Por ejemplo: #6A7 se convierte en #66AA77.
Se puede tomar un valor hexadecimal de cualquier software de gráficos como Adobe Photoshop, Jasc Paintshop Pro o incluso usando Advanced Paint Brush.
Cada código hexadecimal estará precedido por un signo de libra o almohadilla ‘#’. Los siguientes son ejemplos para usar la notación hexadecimal.
| Color | Color HEXAGONAL |
|---|---|
| #000 | |
| #F00 | |
| #0F0 | |
| #0FF | |
| #FF0 | |
| #0FF | |
| #F0F | |
| #FFF |
Colores CSS – Valores RGB
Este valor de color se especifica mediante la propiedad rgb(). Esta propiedad toma tres valores, uno para rojo, verde y azul. El valor puede ser un número entero entre 0 y 255 o un porcentaje.
NOTA: No todos los navegadores admiten la propiedad de color rgb(), por lo que se recomienda no utilizarla.
El siguiente es el ejemplo para mostrar algunos colores usando valores RGB.
| Color | ColorRGB |
|---|---|
| rgb(0,0,0) | |
| rgb(255,0,0) | |
| rgb(0,255,0) | |
| rgb(0,0,255) | |
| rgb(255,255,0) | |
| rgb(0,255,255) | |
| rgb(255,0,255) | |
| rgb(192,192,192) | |
| rgb(255,255,255) |
Códigos de colores de construcción
Puede crear millones de códigos de colores con nuestro Creador de códigos de colores. Consulte nuestro Creador de códigos de colores HTML. Para usar esta herramienta, necesitaría un navegador habilitado para Java.
Colores seguros del navegador
Aquí está la lista de 216 colores que se supone que son los colores más seguros e independientes de la computadora. Estos colores varían desde el código hexadecimal 000000 hasta FFFFFF. Estos colores son seguros de usar porque aseguran que todas las computadoras muestren los colores correctamente al ejecutar una paleta de 256 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 |