Conversión 100% en su navegador

Selector de color HTML

Elige cualquier color visualmente y obtén al instante sus valores HEX, RGB y HSL. Incluye ratio de contraste e historial de colores.

← Clic para abrir el selector
Usados recientemente

Selector de color HTML

Usa el selector visual para elegir cualquier color, luego copia al instante su valor HEX, RGB o HSL. El ratio de contraste sobre fondos blanco y negro se calcula automáticamente para verificar accesibilidad (WCAG).

Formatos de color

  • HEX (#rrggbb): hexadecimal de 6 dígitos, el formato CSS más común.
  • RGB (r, g, b): canales rojo, verde, azul de 0 a 255.
  • HSL (tono, saturación, luminosidad): intuitivo para la manipulación programática de colores.

Ratio de contraste (WCAG)

Las pautas WCAG definen ratios de contraste mínimos entre texto y fondo:

  • 4,5:1 — mínimo para texto normal (nivel AA)
  • 3:1 — mínimo para texto grande (nivel AA)
  • 7:1 — contraste mejorado para texto pequeño (nivel AAA)

Historial de colores

Cada color seleccionado se guarda en la paleta bajo el selector, para volver a él rápidamente durante la sesión.

Paso a paso

  1. Haz clic en el selector para abrirlo y elige un color.
  2. Copia el valor que necesites con Copiar HEX, Copiar RGB o Copiar HSL.
  3. Consulta el fragmento CSS y la relación de contraste con fondo blanco y negro.
  4. Los colores recientes quedan a mano para volver a usarlos.

Preguntas frecuentes

¿Qué diferencia hay entre HEX, RGB y HSL?
HEX y RGB describen la mezcla de rojo, verde y azul: HEX en notación hexadecimal y RGB en decimal. HSL describe tono, saturación y luminosidad, y resulta más intuitivo para ajustar un color.

¿Para qué sirve la relación de contraste?
Indica si el texto de un color es legible sobre un fondo, según las pautas de accesibilidad WCAG.

¿Se guarda el color que elijo?
No se envía a ningún servidor. Los colores recientes se muestran solo en tu navegador.