Conversor
Conversor de colores
Convierte entre HEX, RGB y HSL al instante. Selecciona un color con el selector visual o ingresa el valor manualmente.
Elige un color
Haz clic en el cuadro de color para abrir el selector. Los tres formatos (HEX, RGB, HSL) se actualizan solos.
Vista previa
#3B82F6
También puedes escribir directamente en cualquier campo y los demás se actualizan solos.
#
color: #3b82f6;
color: rgb(59, 130, 246);
color: hsl(217, 91%, 60%);
Conceptos clave
El formato hexadecimal representa un color como seis dígitos en base 16 (0–9, A–F), agrupados en tres pares: rojo, verde y azul. Por ejemplo,
#FF0000 es rojo puro. Es el más común en HTML y CSS.
RGB (Red, Green, Blue) describe un color mediante tres valores numéricos entre 0 y 255, uno por cada canal.
rgb(255, 0, 0) es rojo puro. En CSS también existe rgba() que agrega un canal de opacidad (alpha).
HSL representa el color en términos de Hue (tono, 0–360°), Saturation (saturación, 0–100%) y Lightness (luminosidad, 0–100%). Es el formato más intuitivo para ajustar colores manualmente porque sus dimensiones corresponden a cómo percibimos el color.
Usa HEX para colores fijos de marca (variables CSS o design tokens). Usa RGB/RGBA cuando necesites opacidad dinámica. Usa HSL cuando construyas paletas o quieras variar tono/saturación/luminosidad programáticamente, por ejemplo en themes o generación de variantes de color.