Generador de paleta de colores - Crear esquemas de colores armoniosos

Selecciona un color base para generar automáticamente paletas armoniosas basadas en la teoría del color. Elige entre esquemas complementarios, análogos, triádicos, tetrádicos o complementarios divididos, y copia como variables CSS.

#3398db
#db7633
:root {
  --color-primary: #3398db;
  --color-primary-light: #8ac4ea;
  --color-primary-dark: #19608f;
  --color-secondary: #db7633;
  --color-secondary-light: #eab18a;
  --color-secondary-dark: #8f4819;
}

¿Qué es Generador de paleta?

Color Palette Generator crea automáticamente esquemas de colores armoniosos a partir de un solo color base usando la teoría del color (complementario, análogo, triádico, etc.). Ayuda con las decisiones de color en el diseño web y UI.

Cómo usar

  1. Selecciona un color base usando el selector de color o la entrada HEX
  2. Elige un tipo de armonía (complementario, análogo, triádico, tetrádico, complementario dividido)
  3. Haz clic en cualquier color de la paleta para copiar su valor HEX
  4. Usa el botón de variables CSS para copiar toda la paleta

Preguntas frecuentes

¿Cómo debo elegir un tipo de armonía?
El complementario crea esquemas de alto impacto, el análogo crea esquemas suaves, y el triádico proporciona esquemas equilibrados de 3 colores.
¿Qué son las variaciones claras/oscuras?
Versiones más claras y más oscuras creadas ajustando la luminosidad de cada color en ±20%. Útiles para estados de hover y degradados.
¿Cómo uso esta herramienta?
Selecciona un color base con el selector de color, luego elige un tipo de armonía para generar la paleta automáticamente.
¿Se envían mis datos a un servidor?
No. El procesamiento de colores ocurre completamente en tu navegador; no se envían datos a ningún servidor.
¿Puedo exportar como variables CSS?
Sí. Usa el botón 'Copiar variables CSS' para copiar toda la paleta en formato --color-1: #xxxxxx;.

Herramientas relacionadas

Historial de actualizaciones

Última actualización: 2026-02-20

  • 2026-02-19 Lanzamiento inicial