Utilidad de diseño

Conversor de colores

Pega un color, mira la vista previa y copia el formato HEX, RGB o HSL que necesitas.

Valor del color

Vista previa

Pega un color válido y copia el formato que necesitas al instante.

HEX

#7C3AED

RGB

rgb(124, 58, 237)

HSL

hsl(262, 83%, 58%)

Cómo usar Conversor de colores

Pega un color válido, revisa la vista previa y copia el formato exacto que necesitas para diseño o CSS.

Introduce un valor HEX, RGB o HSL, o usa el selector visual para empezar rápido.

Lee HEX, RGB y HSL en la misma pantalla sin abrir otro conversor.

Usa el botón de copia en el formato que mejor encaja con tu flujo de diseño o frontend.

Es más útil cuando ya tienes un color válido y solo necesitas moverlo a otro formato.

Convierte colores a HEX, RGB o HSL antes de llevarlos a una hoja de estilos.

Mantén coherentes los colores de perfil, thumbnail y redes entre varias herramientas.

Comparte el mismo color en varios formatos sin reescribir valores a mano.

Un buen conversor de colores debe mantener vista previa y códigos comunes en el mismo lugar.

Entrada

#7C3AED

Salida

HEX: #7C3AED
RGB: rgb(124, 58, 237)
HSL: hsl(262, 83%, 58%)

Útil cuando un color de marca se mueve entre CSS y diseño.

Entrada

rgb(10, 10, 15)

Salida

HEX: #0A0A0F
HSL: hsl(240, 20%, 5%)

Sirve para reconstruir el mismo fondo oscuro en varias pantallas.

Puedes introducir valores HEX, RGB o HSL y la página los convierte a los otros formatos comunes.

Sí. El selector de color te deja empezar de forma visual y seguir copiando códigos exactos.

Porque distintos flujos de diseño y frontend prefieren formatos distintos, y verlos juntos ahorra tiempo.