Saltar al contenido
AZ Tools

Conversor de Formatos de Color

Elige un color con el selector nativo o pega un HEX y míralo al instante en todos los formatos CSS comunes — HEX, RGB moderno separado por espacios, RGB clásico con comas, HSL, HSV, OKLCH (el espacio perceptualmente uniforme que prefiere el CSS moderno) y una variable CSS lista para pegar. Cada valor con su propio botón de copiar.

—
Vista previa
  • HEX#3B82F6
  • RGBrgb(59 130 246)
  • RGB (legacy)rgb(59, 130, 246)
  • HSLhsl(217 91% 60%)
  • HSVhsv(217, 76%, 96%)
  • OKLCHoklch(62.3% 0.188 259.8)
  • Variable CSS--color: #3B82F6;

Cómo usar

  1. Usa el selector o pega un HEX (3 o 6 dígitos, # opcional).
  2. Todos los formatos se actualizan al instante.
  3. Copia el formato que necesites con el botón a la derecha.

Preguntas frecuentes

¿Qué es OKLCH?
Un espacio de color perceptualmente uniforme — las distancias numéricas se sienten como distancias visuales iguales. El CSS moderno lo soporta nativamente y herramientas como Figma 2024+ lo están adoptando para gradientes más suaves y mejor contraste.
¿Por qué dos filas RGB?
El CSS moderno usa espacios 'rgb(59 130 246)'; el legacy y navegadores antiguos esperan comas 'rgb(59, 130, 246)'. Producen el mismo color.
¿Y la transparencia (RGBA/HSLA)?
Esta herramienta se centra en colores opacos. Para transparencia, añade '/ 0.5' en la sintaxis moderna (ej: 'rgb(59 130 246 / 0.5)') o usa la clásica 'rgba(…, 0.5)'.
¿HSV es lo mismo que HSB?
Sí — HSV (Value) y HSB (Brightness) son dos nombres para el mismo modelo. CSS no acepta hsv() directamente; usa HSL para hojas de estilo.

Guías sobre este tema

Herramientas relacionadas

Selector de Color HSL

Arrastra los sliders de matiz, saturación, luminosidad y alpha para elegir un color — copia HEX, RGB, HSL o valor arbitrario Tailwind.

Color 0 0

Generador de Colores Aleatorios

Genera una cuadrícula de colores aleatorios en HEX, RGB o HSL — elige cuántos, copia cualquier valor con un clic y regenera al instante para inspirarte.

Aleatorio 0 0

Selector de Color OKLCH

Elige colores en el espacio OKLCH perceptualmente uniforme (luminosidad · croma · matiz) — y ve si cada elección cabe dentro del gamut de pantalla sRGB.

Color 0 0

Vista previa de CSS color-mix()

Compara cómo la función moderna CSS color-mix() mezcla dos colores en distintos espacios de interpolación (srgb, hsl, oklch, lab, lch, hwb, oklab, srgb-linear) — muestras en vivo, hex calculado, tira de gradiente completa por espacio y CSS copiable.

Color 0 0

Conversor de longitud de onda a color (nm → sRGB)

Convierte una longitud de onda en nanómetros (380–780 nm — el espectro visible) a un color sRGB aproximado, con una barra de gradiente arcoíris clicable y líneas de absorción de Fraunhofer del espectro solar real como referencia.

Color 0 0

Conversor de color CMYK ↔ RGB (impresión)

Convierte entre colores RGB/hex de pantalla y porcentajes CMYK para impresión, con estrategias de generación de negro Simple, GCR (Reemplazo de componente gris) y UCR (Eliminación de subcolor), vista previa de separación de canales y lectura de cobertura total de tinta.

Color 0 0