Conversor de Colores

Sobre los modelos de color

Cada formato de esta página describe el mismo color en un idioma distinto. HEX y RGB direccionan directamente los canales de luz roja, verde y azul de tu pantalla — son intercambiables. HSL y HSV reorganizan esa información en matiz, saturación y un eje de luminosidad o valor, lo que resulta más intuitivo cuando quieres aclarar, oscurecer o rotar un tono. CMYK es el modelo de impresión: las tintas cian, magenta, amarillo y negro (key) restan luz al papel blanco, así que la vista previa en pantalla solo es una aproximación de cómo saldrá el color impreso.

Cómo usar el conversor

Elige un color con el selector nativo del navegador o escribe un valor en cualquier campo — HEX admite #RGB y #RRGGBB, RGB admite rgb(r, g, b) y HSL admite hsl(h, s%, l%). Las demás filas se actualizan al instante. Pulsa el botón Copiar junto a cada formato para enviar el valor al portapapeles. Las cinco muestras bajo el formulario previsualizan el mismo matiz al 10%, 30%, 50%, 70% y 90% de luminosidad — haz clic en cualquiera para cargarla en el formulario.

Referencia rápida de formatos

Usa HEX en CSS, herramientas de diseño y manuales de marca — es la forma escrita más compacta. Usa RGB cuando necesites transparencia: pasa a rgba(r, g, b, a) con alfa entre 0 y 1. Usa HSL al montar paletas a mano — mantener matiz y saturación fijos y mover solo la luminosidad produce tintes y sombras que se leen como una misma familia. Usa CMYK únicamente cuando envíes arte a imprenta y pídele al impresor la especificación exacta — cada perfil de impresión desplaza ligeramente los colores.

Preguntas frecuentes

¿La conversión es exacta?

HEX, RGB, HSL y HSV describen colores de pantalla y van y vuelven sin pérdidas, salvo el pequeño redondeo propio de trabajar en canales de 8 bits. CMYK es una aproximación: el resultado real depende del perfil de la impresora, el papel y la tinta, así que usa la salida como punto de partida y confirma con una prueba impresa.

¿Cuál es la diferencia entre HSL y HSV?

Ambos comparten los ejes de matiz y saturación, pero el tercer eje cambia. En HSL, luminosidad 0% es negro y 100% es blanco, con el matiz puro al 50%. En HSV, valor 100% es el matiz puro y 0% es negro — no hay un camino directo al blanco. HSL es más natural para elegir tintes y sombras; HSV es más natural para decidir cuánto debe brillar un matiz.

¿Por qué mi HEX se ve diferente al imprimirlo?

Las pantallas emiten luz de forma aditiva (RGB), las impresoras absorben luz de forma sustractiva (CMYK). Azules, verdes y naranjas vibrantes que se logran fácilmente en pantalla suelen quedar fuera del gamut CMYK. Revisa siempre una prueba impresa antes de aprobar y pregúntale al impresor si prefiere CMYK o, mejor aún, una referencia Pantone para colores institucionales.

¿Puedo pegar cualquier cadena de color CSS?

Los campos HEX, RGB y HSL aceptan las formas CSS más comunes — #RGB, #RRGGBB, rgb(...), rgba(...), hsl(...), hsla(...). Los nombres como tomato y el moderno oklch() aún no se interpretan — conviértelos primero en las DevTools del navegador.

¿Se guardan los valores convertidos en algún sitio?

No. La conversión ocurre por completo en tu navegador; no se envía nada a un servidor y nada se guarda entre visitas. Anota o copia la paleta que quieras conservar.

¿Por qué los tintes usan la luminosidad de HSL?

Mantener matiz y saturación constantes y barrer la luminosidad de HSL produce una escala visualmente coherente — el tipo de rampa que harías a mano para una paleta de UI. Las cinco muestras al 10%, 30%, 50%, 70% y 90% ofrecen un rango rápido entre una sombra profunda y un tinte casi blanco de la misma familia.

Conversor de Colores