Espacio = nueva paleta
Este generador de paletas de colores crea combinaciones de cinco tonos aplicando reglas reales de teoría del color sobre el modelo HSL. Está pensado para diseñadores web, creadores de marca e ilustradores que necesitan una base cromática sólida sin perder tiempo probando al azar: genera, bloquea lo que funciona, ajusta el tono base y exporta.
Selecciona análoga, complementaria, tríada, monocromática o aleatoria en la barra inferior.
Mueve el slider para girar toda la paleta alrededor del círculo cromático.
Pulsa el candado de un color para conservarlo al generar nuevas paletas.
Toca cualquier tarjeta para copiar su HEX, o descarga la paleta en SVG, CSS o TXT.
Tonos vecinos del círculo cromático, separados entre 15° y 30°. Producen paletas serenas y cohesivas, ideales para interfaces largas de leer y marcas que transmiten cercanía.
Enfrenta dos tonos opuestos a 180° (rojo–verde, azul–naranja). El contraste es máximo, por lo que funciona muy bien para resaltar botones y avisos sobre fondos neutros derivados del mismo esquema.
Tres tonos equidistantes a 120° entre sí. Es una armonía vibrante pero equilibrada: conviene dejar un color dominante y usar los otros dos como apoyo para no saturar el diseño.
Un único tono con variaciones de saturación y luminosidad. Es la opción más segura y elegante: garantiza coherencia total y facilita cumplir los criterios de contraste WCAG.
Una buena paleta no es solo bonita: cumple función. Aplica la regla 60-30-10: un 60 % de color dominante (normalmente fondos claros u oscuros), un 30 % de color secundario para tarjetas y secciones, y un 10 % de acento saturado reservado a acciones clave. Comprueba siempre el contraste texto-fondo con una herramienta WCAG: el texto pequeño necesita al menos 4.5:1. Y piensa en accesibilidad desde el inicio: alrededor del 8 % de los hombres perciben los colores de forma distinta, así que nunca comuniques información solo con el color.
Es un conjunto de colores que combinan bien porque sus tonos guardan una relación matemática en el círculo cromático, como 180° en las complementarias o 120° en las tríadas. Esta herramienta aplica esas reglas automáticamente sobre el modelo HSL.
Elige un color dominante para fondos, uno o dos de apoyo para elementos secundarios y un acento muy saturado solo para botones y llamadas a la acción. La regla 60-30-10 ayuda a mantener el equilibrio visual.
La análoga usa tonos vecinos (diferencias de 15° a 30°) y transmite calma y cohesión. La complementaria enfrenta tonos opuestos (180°) y genera máximo contraste y energía.
HEX es la notación hexadecimal de un color en RGB: cada par de caracteres indica la intensidad de rojo, verde y azul, de 00 a FF. Es el formato estándar en diseño web y CSS.
Al activarlo, ese color queda fijo y no cambia al generar nuevas paletas. Así exploras variaciones manteniendo los tonos que ya te convencen.
Sí. Los colores no están sujetos a derechos de autor: úsalos libremente en webs, marcas, ilustraciones o productos, y expórtalos en SVG, CSS o TXT sin registro.