Site Tools

Conversor y Selector de Colores

Ad Space
HEX#6366f1
RGBrgb(99, 102, 241)
RGBArgba(99, 102, 241, 1)
HSLhsl(239, 84%, 67%)
HSLAhsla(239, 84%, 67%, 1)
HSVhsv(239, 59%, 95%)
OKLCHoklch(0.5854 0.2041 277.12)

Paleta de colores

Complementario
Análogos
Triádicos

Verificador de contraste (WCAG)

Texto de ejemplo
17.74relación de contraste
Normal AA
Normal AAA
Grande AA
Grande AAA
Ad Space

El Conversor de Colores es un kit completo para diseñadores y desarrolladores front-end. Pega un color en cualquier formato común — HEX, RGB, RGBA, HSL, HSLA, HSV/HSB o el moderno OKLCH — o elígelo visualmente, y todos los demás formatos se actualizan al instante con un botón de copia. Además de convertir, genera una paleta armoniosa (colores complementarios, análogos y triádicos) a partir de tu color base e incluye un verificador de contraste WCAG para garantizar que el texto siga siendo accesible sobre cualquier fondo. Todo se ejecuta en tu navegador, así que es rápido, privado y siempre disponible.

Cómo usar el Conversor de Colores

  1. Usa el selector de color o escribe un valor (p. ej. #6366f1 o rgb(99,102,241)) en el campo.
  2. Lee todos los formatos en la lista y copia cualquiera con su botón de copia.
  3. Explora la paleta generada y usa el verificador de contraste para probar texto sobre un fondo.

Beneficios y Casos de Uso

  • Convierte al instante entre HEX, RGB, HSL, HSV y OKLCH sin recordar fórmulas.
  • Crea interfaces accesibles verificando el contraste WCAG AA/AAA para texto normal y grande.
  • Genera paletas complementarias, análogas y triádicas para acelerar tu trabajo de diseño.

FAQ

¿Qué formatos de color se admiten?

HEX, RGB, RGBA, HSL, HSLA, HSV/HSB y OKLCH. Pega cualquiera o usa el selector visual y todos los demás se actualizan al instante.

¿Qué es OKLCH?

OKLCH es un espacio de color moderno y perceptualmente uniforme compatible con CSS. Hace que los ajustes de luminosidad y croma se vean más naturales que en HSL.

¿Cómo funciona el verificador de contraste?

Calcula la relación de contraste WCAG entre dos colores y muestra si pasan AA y AAA para texto normal y grande.