Color Palette Generator
Cómo usar
- 1
Seleccionar armonía
Elige una regla de armonía de colores como Análogos o Complementarios para definir la relación entre colores.
- 2
Elegir ambiente
Configura el ambiente con el selector de mood. Elige entre Pastel, Vibrante o Modo Oscuro para tu marca.
- 3
Generar
Haz clic en Generar para crear paletas únicas. Bloquea los colores que te gusten y regenera el resto.
- 4
Exportar
Copia códigos Hex individuales o haz clic en Exportar para obtener la configuración completa de Tailwind CSS.
Guía de Teoría del Color
Entendiendo la Armonía
- Análogos
Colores adyacentes en el círculo cromático. Crea diseños serenos y cómodos, ideales para temas naturales.
- Complementarios
Colores opuestos en el círculo cromático. Genera alto contraste e impacto visual. Excelente para llamadas a la acción.
- Triádico
Tres colores equidistantes en el círculo cromático. Ofrece alto contraste manteniendo armonía.
- Complemento Dividido
Variación del esquema complementario. Usa un color base y los dos adyacentes a su complemento.
- Monocromático
Variaciones de luminosidad y saturación de un solo color. Limpio, elegante y relajante.
- Caos Aleatorio
Colores completamente aleatorios sin reglas. Ideal para inspiración inesperada o brainstorming.
Explorando los Ambientes
- Estándar
Saturación y brillo equilibrados. Adecuado para diseño web general y componentes UI.
- Sueños Pastel
Alto brillo y baja saturación. Suave y tranquilizador. Perfecto para lifestyle o temas de primavera.
- Neón Vibrante
Alta saturación y brillo medio. Energético y llamativo. Ideal para tech, deportes o entretenimiento.
- Modo Oscuro
Bajo brillo y tonos desaturados. Profundo, misterioso y moderno. Reduce la fatiga visual.
- Retro Vintage
Tonos desaturados y ligeramente cálidos. Nostálgico, clásico y atemporal.
Herramientas recomendadas
Utilidades seleccionadas que podrían serte útiles
Elegir Colores Que Funcionen Juntos
Resumen
La teoría del color tiene siglos de acumulación, pero los diseñadores web necesitan paletas 'que funcionen' en minutos. Basado en reglas establecidas (complementario, análogo, triádico, tetrádico), esta herramienta genera matemáticamente paletas armónicas a partir de un color base. Soporta accesibilidad WCAG, variantes claro/oscuro y exportación (variables CSS, Tailwind config, Figma).
Cómo Funciona
Elige un color base (HEX, RGB, HSL) y selecciona el esquema de armonía. La herramienta calcula en espacio HSL. Cada color muestra ratio de contraste WCAG para indicar idoneidad para texto, títulos y acentos.
Cuándo usarlo
Diseño de nueva marca/logo. Selección de tema para sitio web. Composición cromática de presentaciones, posters, gráficos sociales. Inicio de design system. Marketers buscando colores que combinen con su marca.
Preguntas Frecuentes
3-5 es el estándar práctico. Primario, secundario, acento, fondo, primer plano. Más resulta difícil de gestionar.