seegongsik
Mis palabras
Estructura

¿Qué significa un código de color como #FAA832?

Seguro que has visto un código así al elegir el color de una web. Las letras mezcladas parecen un código secreto, pero en realidad son los ceros y unos de la vez pasada, con otra ropa puesta. ¿Lo destapamos juntos?

01

Cuatro ceros y unos se encogen en un carácter

La vez pasada vimos los ceros y unos.
Pero una fila larga de solo ceros y unos
es demasiado larga y confusa para el ojo humano.
Así que los agrupamos de cuatro en cuatro
y eso lo encogemos en un solo carácter.
Cuatro bits pueden formar
cualquier cosa del 0 al 15,
exactamente dieciséis valores.

8
0
4
0
2
0
1
0
DEC
0
HEX
0

Dieciséis valores, del 0 al 15, caben en un carácter.

Pero hay un detalle.
Cuando llega a dos cifras, como 10, 11, 12,
no sabes si es un carácter o dos.
Así que hicimos un trato ingenioso.

02

Después del 9 viene la A

Nuestros números de siempre
solo llegan hasta el 9.
Pero un carácter hexadecimal
tiene que llegar hasta el quince.
¿Y los seis que faltan?
Simplemente tomamos prestadas letras.
Después del 9 viene la A,
luego la B,
y así hasta la F.

0
0
1
1
2
2
3
3
4
4
5
5
6
6
7
7
8
8
9
9
A
10
B
11
C
12
D
13
E
14
F
15

Diez cifras más seis letras dan dieciséis valores en un carácter.

Así que la A es diez,
y la F es quince.
No es un código secreto que dé miedo,
solo letras que tomamos prestadas
porque se acabaron los números.

03

Un color son tres luces mezcladas

Ahora vamos al color en pantalla.
Todos los colores que ves en pantalla
se hacen mezclando tres luces:
rojo, verde y azul.
Qué tan fuerte enciendes cada una
decide el color.
Arrastra tú mismo los tres controles
y mira cómo cambia el color.

#FAA832
rgb(250, 168, 50)
R250
G168
B50

Todo apagado es negro, todo al máximo es blanco.

Ajusta cada luz del 0 al 255
y salen más de dieciséis millones de colores.
Pero ese código de arriba,
¿no te resulta familiar?

04

Corta #FAA832 en tres pedazos

Un código de color es en realidad
solo los tres valores, rojo, verde y azul,
escritos en hexadecimal
y pegados uno al lado del otro.
Corta los seis caracteres en pares
y salen tres pedazos.
Los dos primeros son rojo,
el del medio es verde,
el último es azul.

#FAA832
FA16 × 15 + 10 =250R
A816 × 10 + 8 =168G
3216 × 3 + 2 =50B
#FAA832 = rgb(250, 168, 50)

Léelo de dos en dos caracteres.

La F es 15 y la A es 10, ¿recuerdas?
Así que FA es
16 por 15 más 10,
o sea 250.
Leído así, #FAA832 significa
rojo 250, verde 168, azul 50.
Este amarillo tan cálido.

05

Ahora el código se lee solo

Una vez que le agarras el truco,
con una mirada al código
ya sabes más o menos el color.
Mira los colores de abajo.
Un valor de rojo grande tira a rojizo,
los tres grandes, brillante.
Ya no es un código secreto.

#FF0000
rgb(255, 0, 0)
#00C800
rgb(0, 200, 0)
#3296FF
rgb(50, 150, 255)
#FAA832
rgb(250, 168, 50)
#FF64C8
rgb(255, 100, 200)
#FFFFFF
rgb(255, 255, 255)

Los tres altos dan brillo, uno solo alto y ese color se intensifica.

En una líneaEse código de color con letras que parecía tan cifrado era solo el brillo de tres luces, anotado. Y hasta ese brillo, al final, eran los ceros y unos de la vez pasada.
¿Te fue útil? Apoyar seegongsik
Estructura