Conversor de colores

Conversor de colores gratuito de Bee Tools. Convierte HEX, RGB, HSL, HSV y CMYK en vivo, con selector, escala de brillo y paletas complementaria/triádica/análoga.

Conversión en vivo entre HEX, RGB, HSL, HSV y CMYK, con escalas y paletas. Bee Tools ofrece un conversor de colores en JavaScript nativo. Pega cualquiera de los cinco formatos y ve el resto actualizado al instante, además de escala de brillo de 10 pasos y paletas complementaria/triádica/análoga.

Escala de brillo
Paletas relacionadas
Complementario
Triádico 1
Triádico 2
Análogo

Guía completa de espacios de color

Cinco espacios comparados

  • HEX — estándar en CSS, #RRGGBB en 24 bits.
  • RGB — primarios aditivos, modelo de pantalla.
  • HSL — Matiz, Saturación, Luminosidad, ideal para ajustar brillo.
  • HSV — Matiz, Saturación, Valor, selector estándar de Photoshop.
  • CMYK — Cian, Magenta, Amarillo, Negro, referencia de impresión.

Casos habituales

  1. Diseño → frontend: HEX → RGB / HSL para Tailwind y variables CSS.
  2. Paleta de marca: HSL para crear la escala de luminosidad completa.
  3. Impresión: convertir RGB a CMYK y contrastar con la prueba.
  4. Combinaciones: HSL ±30° / ±120° / ±180° para análogos, triádicos y complementarios.

Consejos

  • Coloca el color primario en 45–55% de luminosidad — hace más fácil generar el rango 100–900.
  • Cumple WCAG 4.5:1 en textos con la ayuda de la escala.
  • HEX de 6 dígitos no cubre gama ancha; usa color(display-p3 ...) para P3.
  • Revisa siempre CMYK en software profesional antes de imprimir.

Sobre esta herramienta

Bee Tools ejecuta todo en el navegador. Entrada desde selector, HEX, RGB, HSL o HSV; salida sincronizada con escala y paletas. Nada se sube, funciona sin conexión.

Aviso de código abierto: La conversión de color es una implementación nativa en JavaScript de este proyecto, publicada bajo la MIT License, sin dependencias externas.

Preguntas frecuentes

¿Qué formatos admite?
HEX, RGB, HSL, HSV y CMYK, los cinco espacios más habituales, sincronizados en tiempo real.
¿Qué precisión ofrece?
RGB usa enteros 0–255, HSL/HSV usan porcentajes y CMYK enteros 0–100, redondeados al entero más cercano.
¿Se suben datos de color?
No. Todo se calcula en el navegador. Los valores nunca salen del dispositivo.
¿Por qué HEX → CMYK → HEX no coincide?
Los gamas RGB y CMYK son distintas. La pantalla cubre más colores que la impresión; los fuera de gamut se mapean al convertir.
¿Qué son complementarios, triádicos y análogos?
Complementario = 180° en el círculo cromático. Triádico = tres colores a 120°. Análogo = ~30° de distancia.
¿Cómo uso la escala de brillo?
Divide el matiz actual en 10 niveles de luminosidad, ideal para paletas UI o tokens de Tailwind.
¿Se admiten canales alfa?
Esta versión trata colores opacos. Para RGBA/HSLA, añade manualmente el alfa al final de la salida.