Conversor de Colores

HEX ↔ RGB ↔ HSL con selector de color

Cargando…

¿Te fue útil esta herramienta?

About this tool

Esta herramienta convierte un código de color HEX en valores RGB y HSL, y calcula si el texto blanco o negro se lee mejor sobre él. También muestra una paleta de seis pasos que mantiene el mismo tono y saturación mientras varía solo la luminosidad, útil para elegir tonos de diseño.

How to use

  1. Haz clic en el selector de color o escribe un valor HEX directamente (funcionan tanto 3 como 6 dígitos).
  2. RGB, HSL y una notación compatible con variables CSS (R G B separados por espacios) aparecen justo debajo.
  3. Haz clic en cualquiera de las seis variantes de luminosidad del mismo tono para cambiar a ese color.
  4. Debajo del cuadro de vista previa, comprueba si el texto blanco o negro tiene más contraste, y consulta la relación de contraste exacta.

Frequently asked questions

¿Qué formatos de color admite esta herramienta?
Toma HEX (3 o 6 dígitos) como entrada y lo convierte a RGB, HSL, y una notación 'R G B' separada por espacios para variables CSS (como en rgb(var(--x) / 0.5)). No se admiten formatos de impresión como CMYK.
¿Cómo se calcula la relación de contraste?
Calcula la luminancia relativa de cada color usando la fórmula WCAG, y luego la compara con fondos blanco y negro para obtener la relación de contraste. Un número más alto significa más contraste y texto más legible.
¿Cómo se generan las seis variantes de luminosidad?
Mantienen el tono (H) y la saturación (S) del color de entrada sin cambios y solo varían la luminosidad (L) en 90/75/60/45/30/15% para construir la paleta de seis pasos.
¿El valor de color que introduzco se envía a un servidor?
No. Toda la conversión y el cálculo de contraste ocurren en tu navegador y nunca se envían a un servidor.

Herramientas similares