Generador de paletas de colores
Crea paletas de colores armónicas a partir de un color base y las reglas clásicas de la teoría del color: análoga, complementaria, monocromática, tríada, complementaria dividida y cuadrada. Elige un color con el selector o escribe su código hexadecimal y obtén al instante una combinación equilibrada; copia cualquier color con un clic o toda la paleta como variables CSS. Todo ocurre en tu navegador, sin cuentas ni conexión.
Cómo crear una paleta de colores
- Elige el color base con el selector o escribe su código hexadecimal (por ejemplo, #12b886).
- Selecciona el tipo de armonía: análoga, complementaria, monocromática, tríada, complementaria dividida o cuadrada.
- La paleta se genera al instante siguiendo la rueda de color.
- Haz clic en cualquier muestra para copiar su código hex, o copia toda la paleta como variables CSS.
- Pulsa «Aleatorio» para explorar combinaciones a partir de un color al azar.
Preguntas frecuentes
¿Qué es una paleta de colores armónica?
Es un conjunto de colores que combinan bien entre sí porque guardan una relación concreta en la rueda de color (el círculo cromático). En lugar de elegir colores al azar, se parte de un color base y se rotan su tono en ángulos determinados —o se varía su luminosidad— para obtener combinaciones equilibradas y agradables a la vista.
¿Qué armonías puedo generar?
Seis reglas clásicas de la teoría del color: análoga (tonos vecinos), complementaria (tonos opuestos), monocromática (un solo tono en distintas luminosidades), tríada (tres tonos equidistantes), complementaria dividida y cuadrada (cuatro tonos cada 90°). Cada una da un carácter distinto: unas más suaves y otras de mayor contraste.
¿Qué es una combinación complementaria?
Usa dos colores opuestos en la rueda de color (separados 180°), como el azul y el naranja. Es la combinación de mayor contraste: llama mucho la atención y funciona bien para resaltar un elemento, aunque conviene usar uno como acento y el otro como color principal.
¿Y una paleta análoga?
Toma tonos vecinos en la rueda de color (a un lado y otro del color base, en pasos de unos 30°). Al compartir familia cromática, el resultado es armónico y tranquilo; es la regla que usan muchos diseños de marca y fondos suaves. Es la armonía predeterminada de esta herramienta.
¿Qué diferencia hay entre tríada, cuadrada y complementaria dividida?
La tríada usa tres tonos separados 120° (muy equilibrada y viva). La cuadrada usa cuatro tonos cada 90°, para paletas ricas con dos pares complementarios. La complementaria dividida parte del color base y toma los dos vecinos de su complementario: mantiene un buen contraste pero es menos tenso que la complementaria pura.
¿Qué es una paleta monocromática?
Es una escala de un mismo tono (y saturación) en distintas luminosidades, del más claro al más oscuro. Aporta una sensación muy cohesionada y elegante, ideal para estados de interfaz (hover, activo), sombras y jerarquías visuales sin introducir colores nuevos.
¿Cómo uso la paleta en mi proyecto?
Haz clic en cualquier muestra para copiar su código hexadecimal al portapapeles, o copia la paleta completa como variables CSS (:root { --color-1: …; }) para pegarla directamente en tu hoja de estilos. Los mismos valores hex sirven en cualquier editor de diseño.
¿Se sube algo a un servidor?
No. La paleta se calcula por completo en tu navegador con JavaScript; el color que eliges nunca sale de tu equipo y la herramienta funciona sin conexión una vez cargada.