Question 1

¿Qué diferencia hay entre RGB, HSV, HSL y HEX?

Accepted Answer

Los cuatro describen el mismo color, pero con coordenadas distintas. RGB lo define por cantidad de rojo, verde y azul (0-255 cada canal). HEX es exactamente RGB escrito en hexadecimal (#RRGGBB), el formato típico de CSS. HSV (tono, saturación, valor) y HSL (tono, saturación, luminosidad) reordenan la información en torno al tono para que sea más intuitivo elegir y ajustar colores: cambiar solo el brillo o solo la intensidad es directo, algo incómodo en RGB.

Question 2

¿Cuándo conviene usar HSV o HSL en lugar de RGB?

Accepted Answer

HSV y HSL son más cómodos cuando trabajas con el color de forma perceptual: crear una paleta variando el tono, oscurecer o aclarar manteniendo el matiz, o generar variaciones de un mismo color para un personaje o una interfaz. RGB y HEX son mejores para almacenar o transmitir el color (CSS, formatos de imagen, shaders), porque es la representación que usa la pantalla. Un flujo habitual es elegir en HSV/HSL y exportar en HEX o RGB.

Question 3

¿Por qué RGB es un modelo aditivo y CMYK no?

Accepted Answer

RGB es aditivo: parte del negro (pantalla apagada) y suma luz roja, verde y azul; al sumar las tres al máximo se obtiene blanco. Es el modelo de las pantallas, los videojuegos y la generación de imágenes. CMYK es sustractivo: parte del blanco del papel y resta luz con tintas (cian, magenta, amarillo, negro). Por eso no debes diseñar para pantalla pensando en CMYK ni esperar que un color RGB vibrante se imprima idéntico: son procesos físicos distintos.

Question 4

¿Cómo se convierte un color de RGB a HSV?

Accepted Answer

Se normalizan R, G y B al rango 0-1 y se toman su máximo y su mínimo. El valor V es el máximo. La saturación S es 0 si el máximo es 0, y en otro caso (máx − mín) / máx. El tono H se calcula según cuál de los tres canales sea el máximo, comparando los otros dos, y se expresa en grados de 0 a 360. HSL es parecido pero la tercera componente es la luminosidad, definida como (máx + mín) / 2.

Question 5

¿Sirve este visualizador para comprobar el contraste y la accesibilidad?

Accepted Answer

Ayuda a entender cómo cambia un color al mover su luminosidad o saturación, lo cual es el primer paso para ajustar contraste entre texto y fondo. Sin embargo, el contraste accesible (WCAG) se mide con la ratio de luminancia relativa entre dos colores, no con un único color, así que para verificar conformidad conviene calcular esa ratio entre el color de texto y el de fondo con una herramienta específica de contraste.

Visualizador de Espacios de Color

1. Selecciona el color

2. El mismo color en cada espacio

📚Guía de Espacios de Color

🔗Apps relacionadas