If you're seeing this message, it means we're having trouble loading external resources on our website.

Si estás detrás de un filtro de páginas web, por favor asegúrate de que los dominios *.kastatic.org y *.kasandbox.org estén desbloqueados.

Contenido principal

El espacio de color HSL (tono, saturación y brillo)

Ahora vamos a considerar el espacio de color del modelo TSB (HSL).

¿Quieres unirte a la conversación?

¿Sabes inglés? Haz clic aquí para ver más discusiones en el sitio en inglés de Khan Academy.

Transcripción del video

Aunque las coordenadas RGB son excelentes para  representar la forma en la que generamos los   colores, a los artistas no les parece natural  su uso; en su lugar se utilizan los conceptos   de tono, saturación y luminosidad  para encontrar el color exacto que   necesitamos. En el círculo de saturación y  tono, el ángulo alrededor del círculo define   el tono y el radio define la saturación. La  posición en este círculo se combina con la   posición del deslizador de luminosidad para  definir el color final. A partir de ahora,   a este deslizador de luminosidad lo voy a  llamar dimensión de luminosidad, pues sólo   requiere de un número para definirlo, y este  color que se define con los ajustes HSL -tono,   saturación, luminosidad por sus siglas en inglés-  coincide con una posición del cubo cromático RGB,   lo que nos lleva al problema principal de esta  lección. ¿Cómo se convierte cada ajuste HSL en un   único punto en el cubo RGB? Primero pensemos cómo  podemos ir de un cubo tridimensional a un círculo   en dos dimensiones. El truco está en pensar en  dónde están los grises de nuestro cubo cromático.   En cualquier lugar del cubo cromático en el que  los valores RGB sean iguales, tendremos algún tono   de gris. Por ejemplo, 20%, 20% y 20% nos da este  gris oscuro, y 80%, 80%, 80% nos da este gris más   claro. Eso significa que hay una recta de grises  en nuestro cubo RGB, lo que quiere decir que sólo   se requiere una dimensión para describir todos  los grises. Rotemos ahora nuestro cubo cromático   de manera que veamos directamente por encima de la  recta gris. ¿Te parece familiar? Los matemáticos   hacen un poco de trampa y convierten esto en un  círculo. Para lograr esto hay algunos cálculos   matemáticos sofisticados que vamos a ignorar aquí.  Es este el origen del círculo de saturación y   tono. Finalmente llegamos a la dimensión de  luminosidad. Para esto, volvamos al espacio   tridimensional para transformar nuestro círculo  en un cilindro. La dimensión de luminosidad define   qué porción vamos a tomar de nuestro cilindro  cromático. Un valor de luminosidad del 50% toma   la porción de en medio. Y para aclarar el tono  de cualquier color en este círculo, movemos la   dimensión de luminosidad hacia alguna porción  más arriba. Para oscurecer el color, movemos   la dimensión de luminosidad hacia abajo. Esto es  importante. Vamos a parar aquí. En el siguiente   ejercicio te retaremos a que pienses en este  modelo un poco más. Tómate tu tiempo y diviértete.