Guía de Selector de Color

¿Qué hace esta herramienta

El Selector de color convierte entre cinco formatos de color habituales: HEX, RGB, HSL, HSV y CMYK. Elige un color visualmente con la muestra nativa, o escribe un código de color en cualquier formato soportado — la herramienta muestra al instante el equivalente en los cinco formatos. Copia cualquier valor con un clic. Ideal para diseñadores, desarrolladores y cualquiera que trabaje con códigos de color en distintas herramientas y sistemas.

Cómo usarla

1. Elige un color visualmente — Haz clic en la muestra para abrir el selector de color nativo del sistema. Elige un color; la herramienta actualiza todos los códigos de formato automáticamente.
2. O escribe un código de color — Pega o escribe un color en cualquier formato soportado:
   • HEX: #ff6b6b o #f66
   • RGB: rgb(255, 107, 107)
   • HSL: hsl(0, 100%, 71%)
   • HSV: hsv(0, 58%, 100%)
   • CMYK: cmyk(0%, 58%, 58%, 0%)
3. Copia lo que necesites — Usa el botón Copiar junto a cualquier formato para copiar ese valor al portapapeles.
4. Sincronización bidireccional — Cambiar la muestra actualiza el texto; escribir un código válido actualiza la muestra y todos los demás formatos.

Cómo funciona

Los cinco formatos se derivan de una única tupla RGB (rojo, verde, azul, cada uno 0–255) como intermediario canónico. Cuando introduces un color:

1. Parseo — La herramienta prueba el parser de cada formato (HEX, RGB, HSL, HSV, CMYK) hasta que uno tiene éxito.
2. Convertir a RGB — La entrada se convierte a una tupla RGB entera.
3. Generar todos los formatos — Desde RGB, la herramienta calcula HEX, cadena RGB, HSL, HSV y CMYK en paralelo.
4. Mostrar — Los cinco códigos de formato se muestran con botones Copiar.

Entrada inválida muestra un error inline; entrada vacía no hace nada (sin error, sin cambio). El selector de color nativo siempre devuelve un valor HEX de 6 dígitos en minúsculas válido, así que la ruta visual nunca provoca error de parseo.

Todo el procesamiento se ejecuta en tu navegador. No se envía ningún dato a ningún servidor.

Casos de uso y ejemplos

• Desarrollo web — Convierte un color de diseño (ej. CMYK de impresión) a HEX o RGB para CSS.
• Entrega de diseño — Proporciona a desarrolladores múltiples códigos de formato desde una sola selección.
• Accesibilidad — Ajusta luminosidad o saturación (HSL/HSV) para cumplir requisitos de contraste.
• Preparación para impresión — Convierte colores de pantalla (RGB) a CMYK para flujos de impresión.
• Consistencia de marca — Asegura que el mismo color se use correctamente en web, app e impresión.

Limitaciones y restricciones conocidas

• Precisión — RGB usa enteros (0–255), así que las conversiones pueden tener ±1 canal de redondeo. Es estándar y suficiente para uso típico.
• Gamut de color — CMYK puede representar algunos colores que RGB no; convertir de CMYK a RGB puede ser aproximado.
• Selector nativo — Las capacidades del selector visual dependen de tu sistema operativo y navegador.
• Entrada vacía — Limpiar el campo no limpia los códigos mostrados; deja visible el último color válido.