w3.unpo<code>todo

Colores hex

Podemos decir que los colores hex son otro tipo de colores rgb.
A continuación vamos a ver porque, y vamos a ver como especificar los colores utilizando códigos hex.
Esta es la representación en código hex del mismo anaranjado de antes: #FF9900;

#FF9900;
rgb(100%, 60%, 0%);

Un color hex siempre empieza con # ( la almohadilla ). Los primeros dos dígitos representan el rojo, los dos siguientes, el verde, y los últimos dos, el azul.
Y sí, son dígitos. Cada dos dígitos representan un número en base 16, equivalente a un numero de 0 a 255 en base 10.

Como calcular el equivalente rgb de un color hex.

Tabla de conversión entre números decimales y hexadecimales

Pensemos un momento en un numero de 2 dígitos en base 10, por ejemplo 34.
En base 10 el primer dígito ( 3 ) representa las decenas, y el segundo, las unidades. Para "calcular" el valor del número multiplicamos el dígito representando las decenas con 10 y le sumamos las unidades.
(3*10)+4 = 34

Haremos lo mismo con los números en base 16, donde, en lugar de multiplicar por 10, multiplicaremos por 16.

1) Separaremos el código hex ( #FF9900; ) en los 3 componentes:

rojo = FF;
verde = 99;
azul = 00;

2) Empezaremos calculando el valor decimal para el rojo. ( FF )

El segundo dígito ( F ) representa las unidades.
Según la tabla de equivalencias F = 15

Continuaremos con el primero de los dos dígitos, que transformaremos en su equivalente en base 16, y después lo multiplicaremos por 16.

F=15;
15*16 = 240;

Ahora le sumaremos las unidades:

240+15=255;

El valor decimal para el rojo = 255.
3) A continuación calcularemos de la misma manera el valor decimal para el verde.
En base 16 verde = 99

El primero dígito: 9*16 = 144
El segundo dígito: 9 = 9
Sumamos la unidades: 144 + 9 = 153
El valor decimal para el verde = 153.
4) Obviamente
El valor decimal para el azul es 0.

#colores_rgb{
	width:100px; 
	height:100px; 
	background-color:rgb(255,153,0);
}

Convierta fácilmente los colores hex en rgb o hsl y vicevarsa.

Como calcular el equivalente hex de un color rgb()

Este es el código rgb del mimo anaranjado de antes: rgb( 255 , 153 , 0 )

1) Separaremos el código rgb en los 3 componentes:

rojo = 255;
verde = 153;
azul = 0;

2) Empezaremos calculando el valor hexadecimal para el rojo. (255) 
255 / 16 = 15.9375
De esta división guardaremos solo los enteros ( 15 ) que según la tabla de equivalencias  = F.
Este será el primero de los dos dígitos.
El resto (residuo) de esta división = 15 que según la tabla de equivalencias  = F.
Este será el segundo de los dos dígitos.
El valor hex para el rojo es FF.

3) De la misma manera calcularemos el valor hexadecimal para el verde.
153 / 15 = 9.5625
9dec = 9hex
El resto (residuo) de esta división = 9
9dec = 9hex
El valor hex para el verde es 99.

4) Obviamente
El valor hex para el azul es 00.

#colores_hex{
	width:100px; 
	height:100px; 
	background-color:#FF9900;
}