Conversor de Formatos de Color CSS

• Conversión instantánea de formatos de color CSS: pega cualquier valor de color CSS (hex3, hex6, hex8, rgb(), rgba(), hsl(), hsla(), hwb(), oklch(), lch(), lab() o un color con nombre) y obtén todos los formatos equivalentes en milisegundos. El conversor procesa todo en tu navegador sin espera.
• Conversor de formatos de color CSS online y seguro: tu código CSS nunca sale de tu dispositivo. El conversor funciona por completo en el lado del cliente en tu navegador: sin subida a servidores, sin registro de datos, sin peticiones a terceros. Convierte tokens de diseño confidenciales y hojas de estilo de producción con total privacidad.
• Conversor de formatos de color CSS sin instalación: funciona en cualquier navegador moderno, sin descargas, complementos ni extensiones. Abre la página y empieza a convertir al instante: funciona en escritorio, tablet y móvil.
• 100% gratis, sin límites ni anuncios: el conversor de formatos de color CSS es totalmente gratis, sin registro, sin cuenta, sin nivel premium y sin límites de uso. Convierte colores sueltos o archivos CSS enteros tantas veces como quieras, gratis para siempre.

• Migración de CSS a funciones de color modernas: convierte valores heredados hex y rgb() de tus hojas de estilo a hsl() u oklch() modernos para mejorar la legibilidad y facilitar el theming. El conversor procesa bloques CSS enteros de una vez, ahorrando horas de buscar y reemplazar manualmente.
• Estandarización de tokens de diseño: estandariza los tokens de color de tu sistema de diseño a un solo formato en todos los archivos. Usa el conversor para asegurar que cada token de tu configuración de Tailwind, variables CSS o mapas SCSS use la misma notación.
• Entrega de Figma y herramientas de diseño: Figma exporta colores en hex o rgb(); tu framework CSS puede esperar hsl(). Usa el conversor para traducir al instante los valores de la entrega de diseño al formato que usa tu código, sin cálculos manuales.
• Igualación de color para impresión y multiplataforma: convierte colores de pantalla a CMYK para producción impresa, u obtén valores CIE LAB para especificar color independiente del dispositivo. El conversor genera CMYK y LAB junto a todos los formatos CSS en un solo paso.
• Refactorización y auditoría de código: audita un código heredado que mezcla hex, rgb() y colores con nombre de forma inconsistente. Pega cualquier hoja de estilo en el modo bloque del conversor y convierte todos los colores a tu formato preferido con un clic.
• Accesibilidad y trabajo con colores WCAG: al comprobar contrastes WCAG a menudo necesitas colores en un formato concreto. El conversor traduce al instante cualquier color al formato que requiera tu herramienta de pruebas de accesibilidad o tu revisión de diseño.

La conversión de formatos de color CSS es el proceso de expresar el mismo valor de color en una notación CSS distinta. CSS admite más de una docena de formatos de color, desde el clásico trío hexadecimal (#rrggbb) hasta formatos perceptivos modernos como oklch() y lab(). Cada formato codifica de forma distinta el mismo color subyacente: hex usa valores de canal en base 16, rgb() usa canales decimales de 0 a 255, hsl() usa ángulo de tono y luminosidad porcentual, y oklch() usa luminosidad perceptual y croma. El conversor de formatos de color CSS analiza cualquiera de estas notaciones y genera todas las representaciones equivalentes al instante, para que uses el formato que requiera tu flujo de trabajo sin cálculos manuales.

La conversión ocurre en tres pasos, completamente en tu navegador:

1. Introduce tu color CSS: escribe o pega cualquier valor de color CSS en la pestaña Color único (hex3, hex4, hex6, hex8, rgb(), rgba(), hsl(), hsla(), hwb(), oklch(), lch(), lab() o cualquiera de los 148 colores con nombre de CSS). Para conversión masiva, cambia a la pestaña Bloque CSS y pega tu hoja de estilo completa.
2. Procesamiento instantáneo en el navegador: pulsa Convertir y el conversor analiza tu entrada, la normaliza a una representación interna RGBA y luego calcula todos los formatos de salida con matemáticas de color precisas. No se envían datos a ningún servidor: todo el procesamiento ocurre localmente en tu navegador.
3. Copia o descarga la salida: en el modo Color único, pulsa el icono de copiar junto a cualquier fila de formato para copiar ese valor. En el modo Bloque CSS, la hoja de estilo convertida aparece en el panel de salida: pulsa «Copiar salida» para copiar todo el CSS convertido al portapapeles.

• Formatos HEX (hex3, hex4, hex6, hex8): el hex corto de 3 dígitos se expande a 6 dígitos; el hex de 4 y 8 dígitos incluye el canal alfa. Toda la salida hex va en mayúsculas por consistencia.
• RGB y RGBA: valores de canal decimales de 0 a 255 con alfa opcional (0-1). El conversor también acepta valores rgb() en porcentaje y los normaliza a canales enteros.
• HSL, HSLA y HWB: formatos basados en tono usados de forma nativa en CSS Color Level 4. El conversor acepta tono en grados, radianes, vueltas y gradianes, y lo normaliza a grados en la salida.
• Formatos modernos (oklch, lch, lab): espacios de color perceptualmente uniformes de CSS Color Level 4. El conversor analiza estas entradas y las convierte a todos los demás formatos mediante matemáticas de color precisas.

El conversor de formatos de color CSS usa el espacio de color sRGB como representación intermedia. Los colores especificados en espacios de gama amplia (display-p3, rec2020) que quedan fuera de sRGB se recortan al valor sRGB más cercano. La salida CMYK usa una fórmula matemática simple sin perfiles ICC: para trabajos de impresión de producción, usa la conversión basada en perfiles ICC de tu software de impresión. El formato HSV no es una función nativa de CSS; se ofrece como valor de referencia para usarlo en herramientas de diseño como Photoshop y Figma.