util.ar/Diseño/hex
Diseño

Picker de color.

Convertí entre HEX, RGB, HSL y OKLCH. Validá contraste WCAG y armá paletas accesibles.

¿Para qué sirve?

Un picker de color que entiende formatos modernos: además de HEX y RGB clásicos, te muestra OKLCH (espacio perceptualmente uniforme, ideal para paletas con gradientes naturales). Validá contraste contra blanco o negro según WCAG AA/AAA y generá paletas que se ven bien en cualquier nivel de luz.

Lo que hace
  • Conversión entre HEX, RGB, HSL, OKLCH
  • Contraste WCAG AA/AAA contra background elegido
  • Generador de paleta tonal (light/dark variants)
  • Detector de daltonismo (deuteranopia, protanopia, tritanopia)
  • Mezclador entre dos colores en OKLCH (interpolación perceptual)
  • Copia rápida en cualquier formato
Casos de uso
  1. 01Validar contraste de un botón en una landing
  2. 02Armar paletas accesibles para una marca
  3. 03Convertir colores de Figma a CSS variables
  4. 04Probar cómo se ve un color para personas con daltonismo
  5. 05Generar variantes hover/active a partir de un color base
Próximamente

hex.util.ar

Estamos terminando esta app. La landing va a quedar viva en hex.util.ar.

Próximamente
Preguntas frecuentes
¿Qué es OKLCH y por qué es mejor que HSL?

OKLCH es un espacio de color perceptualmente uniforme: dos colores con la misma L se ven igual de luminosos para el ojo, cosa que no pasa en HSL. Para gradientes y paletas armoniosas, es muy superior.

¿Qué significa WCAG AA y AAA?

Niveles de accesibilidad de contraste. AA pide ratio ≥ 4.5:1 para texto normal y 3:1 para grande. AAA pide 7:1 y 4.5:1. AA es el mínimo legal en muchos países.

¿Soporta wide gamut (P3)?

Sí. OKLCH puede expresar colores fuera de sRGB. Si tu monitor lo soporta y tu CSS usa OKLCH directamente, los ves más saturados.

¿Cómo simula daltonismo?

Aplicamos matrices de transformación validadas (Brettel-Viénot-Mollon) para los 3 tipos comunes. Es una aproximación útil, no un diagnóstico médico.