Añade la entrada
Un color HEX de partida.
Mesa de diseño
Generador de paletas de colores
Explora tintes y colores complementarios y copia los que necesites.
Privacidad integradaTu trabajo permanece contigo
Selecciona cualquier muestra para copiar su valor HEX.
Tu trabajo permanece privado en el navegador mientras usas esta herramienta.
¿Qué hace generador de paletas de colores?
Convierte un color HEX inicial en seis tonos claros y oscuros mezclados en RGB más un complementario HSL. Puedes copiar cada muestra o un bloque :root con siete variables.
- Entrada
- Un color HEX de partida.
- Resultado
- Siete muestras HEX y variables CSS listas para copiar.
- Precio
- Gratis
- Cuenta
- No necesaria
Cómo usar generador de paletas de colores
Elige los ajustes
Explora tintes y colores complementarios y copia los que necesites.
Guarda o copia
Siete muestras HEX y variables CSS listas para copiar.
Consejo práctico
Usa un color dominante y reserva las demás muestras para acentos y estados.
Cuándo usar generador de paletas de colores
Preparar una escala compacta de tokens para un prototipo.
Encontrar un acento complementario para probar junto a un color de marca.
Copiar propiedades CSS como punto de partida para estados, bordes y superficies.
Ejemplo
Un ejemplo concreto de generador de paletas de colores
- Entrada
- Color base #0EA5E9
- Resultado
- Las siete muestras son #D8F1FB, #A3DDF7, #62C5F1, #0EA5E9, #0B84BA, #086087 y el complementario #E9520E. El CSS copiado las nombra de --palette-1 a --palette-7.
Qué puedes esperar
Cómo funciona
Tres tintes mezclan linealmente los canales RGB codificados hacia el blanco, dos sombras hacia el negro y el complementario gira 180 grados el tono HSL sin cambiar saturación ni luminosidad. La luminancia relativa decide si cada muestra usa texto claro u oscuro.
Antes de usarla
Límites y casos especiales
- La escala usa interpolación sRGB sencilla, no una escala perceptualmente uniforme como OKLCH; la separación visual entre tonos puede ser desigual.
- Las muestras no se validan automáticamente por contraste, daltonismo, idoneidad de marca o gama de impresión.
Normas y fuentes
Preguntas frecuentes
Preguntas sobre Generador de paletas de colores
¿generador de paletas de colores es gratis?
Sí. Generador de paletas de colores se puede usar gratis.
¿generador de paletas de colores mantiene privado mi trabajo?
Sí. Tu trabajo permanece privado mientras usas la herramienta; no se sube lo que introduces.
¿Cómo se elige el color complementario?
El color se convierte a HSL y el tono gira exactamente 180 grados. La saturación y la luminosidad se conservan.
¿Los siete tonos forman una escala estándar de diseño?
No. Son valores predecibles de ayuda, no una escala calibrada de Tailwind, Material u otro framework. Renómbralos y valídalos para tu sistema.