Selector de Color

Herramienta de selección de color online, conversión entre formatos HEX, RGB, HSL, genera esquemas de color

Seleccionar Color
#2563eb
Ingresar Color
Colores Recientes
Sin historial
Formatos de Color
HEX#2563eb
RGBrgb(37, 99, 235)
HSLhsl(217, 91%, 53%)
Esquemas de Color
Complementario
Análogo
Triádico
Complementario Dividido
Tonos y Matices
Claros
Oscuros

¿Qué es un Selector de Color?

Un selector de color es una herramienta comúnmente usada en desarrollo frontend y diseño UI que te ayuda a seleccionar colores con precisión y convertir entre diferentes formatos. HEX usa notación hexadecimal, RGB se basa en primarios rojo, verde y azul, y HSL se basa en tono, saturación y luminosidad — cada uno con sus propios casos de uso.

Cómo Usar

  1. Haz clic en el selector de color para elegir un color, o ingresa un valor en el campo
  2. Visualiza los resultados de conversión en formatos HEX, RGB y HSL
  3. Haz clic en el botón de copiar junto a un formato para copiar el valor
  4. Consulta los esquemas de color para sugerencias de combinaciones complementarias, análogas, etc.
  5. Revisa los tonos y matices para variantes más oscuras y claras del mismo color

Usos Comunes

  • Desarrollo CSS: Obtén rápidamente valores HEX/RGB/HSL para código de estilos
  • Diseño UI: Selecciona el color primario de marca y genera esquemas completos
  • Pruebas de Accesibilidad: Asegura contraste suficiente entre texto y fondo
  • Conversión de Color: Convierte rápidamente entre diferentes formatos de color

Preguntas Frecuentes

Q: ¿Cuál es la diferencia entre HEX, RGB y HSL?

A: HEX usa hexadecimal (ej., #2563eb), común en CSS; RGB usa componentes rojo, verde, azul (ej., rgb(37,99,235)), bueno para programación; HSL usa tono/saturación/luminosidad (ej., hsl(217,91%,53%)), más intuitivo.

Q: ¿Qué son los colores complementarios?

A: Los colores complementarios están opuestos en la rueda de colores, como rojo y verde, o azul y naranja. Los esquemas complementarios crean fuerte contraste y se usan para destacar elementos.

Q: ¿Cómo elijo un buen esquema de color?

A: Esquemas análogos son armoniosos y naturales; complementarios tienen fuerte contraste, buenos para énfasis; triádicos son vibrantes. Una buena proporción es 60% primario, 30% secundario, 10% acento.

Q: ¿Los datos de color se suben a servidores?

A: No. Todos los cálculos de color ocurren localmente en tu navegador. No se suben datos.