Sin subida, 100% local, sin cuenta

Generador de esquemas de color

Elige un color base y obtén una paleta completa, complementaria, análoga, triádica, tetrádica o monocromática. Copia cualquier muestra como HEX, RGB o HSL. Nada abandona tu navegador.

Cómo funciona Generador de esquemas de color

El generador de esquemas de color construye paletas de colores completas a partir de un único color base que eliges: complementario (opuesto en la rueda de matices), análogo (matices adyacentes), triádico (tres matices equidistantes), tetrádico (cuatro matices en dos pares complementarios) y monocromático (variando la luminosidad y la saturación del mismo matiz). Toda la lógica de paleta se ejecuta en el navegador; nada de lo que introduces sale de tu dispositivo.

Cada paleta generada muestra muestras con sus valores HEX y RGB listas para copiar. Esto da a los diseñadores un punto de partida basado en la teoría del color en lugar de suposiciones. Como el generador funciona sin conexión después de la carga inicial de la página, puedes experimentar libremente con los colores de marca durante una reunión con un cliente sin necesitar conexión de red. Introduce tu color base en la notación que tengas, HEX, RGB o HSL, y cada muestra generada se devuelve en las tres para que puedas copiar la que espera tu herramienta de diseño.

Cómo usar Generador de esquemas de color, paso a paso

  1. Elige un color base usando el selector de color o escribiendo un valor HEX.
  2. Elige un tipo de armonía en las pestañas: complementario, análogo, triádico, tetrádico o monocromático.
  3. Las muestras de la paleta aparecen instantáneamente con sus valores HEX y RGB.
  4. Haz clic en cualquier muestra para copiar su valor HEX al portapapeles.
  5. Ajusta el color base para explorar variaciones y observa cómo se actualiza toda la paleta.

Casos de uso comunes

  • Un diseñador que comienza una nueva identidad de marca elige su color primario y genera una paleta triádica para proponer combinaciones de tres colores a un cliente.
  • Un desarrollador que construye un tema oscuro usa la paleta monocromática para generar una gama de tintes y sombras a partir de un único color de marca.
  • Un creador de contenidos elige una paleta análoga para seleccionar colores de acento para una presentación que se sientan coherentes sin un contraste fuerte.
  • Un diseñador de interfaz usa la paleta complementaria para identificar un color de acento de alto contraste que destaque sobre el color principal de marca.

Preguntas frecuentes

¿Cómo funciona la paleta complementaria?

Un color complementario es el matiz directamente opuesto al color base en la rueda de colores HSL, a 180 grados de distancia. Colocar colores complementarios uno al lado del otro crea el máximo contraste. La herramienta muestra el color base y su complementario, más variantes más claras y oscuras de cada uno.

¿Cuál es la diferencia entre las paletas triádica y tetrádica?

Una paleta triádica usa tres matices equidistantes a 120 grados en la rueda de colores. Una paleta tetrádica usa cuatro matices a 90 grados de separación, formando dos pares complementarios (también llamada doble complementaria o paleta cuadrada). Las paletas tetrádicas son más complejas y requieren un cuidado especial en el equilibrio de proporciones para evitar el ruido visual.

¿Los colores que elijo se almacenan o se envían a algún lugar?

No. La generación de paletas es aritmética sobre la representación HSL del color base: rotar el ángulo de matiz en cantidades fijas, desplazar la luminosidad y la saturación. Cada cálculo se ejecuta localmente en el navegador; nada se envía a ningún servidor.

¿Puedo exportar la paleta como un archivo CSS o un archivo de tokens de diseño?

La herramienta actualmente muestra muestras con valores HEX y RGB copiables. Para una exportación completa de propiedades CSS personalizadas o un JSON de tokens de diseño, copia los valores manualmente en el archivo de tokens de tu proyecto o en el CSS. Un botón de exportación dedicado puede añadirse en una actualización futura.

¿Este generador sigue algún estándar formal de teoría del color?

Los cálculos de paleta usan fórmulas de rotación de matiz estándar en el espacio de color HSL, que es la convención en la mayoría de las herramientas de diseño web. La uniformidad perceptiva exacta de HSL tiene limitaciones en comparación con LAB u OKLCH, pero las rotaciones HSL producen paletas que coinciden con las convenciones de la rueda de colores que los diseñadores suelen esperar.