Xerador de paletas de cor de balde

Como funciona

A ferramenta constrúese sen bibliotecas externas — toda a matemática de cores execútase en JavaScript escrito a man directamente no teu navegador. Converte a cor escollida entre hexadecimal e HSL, e despois aplica regras clásicas de harmonía da teoría da cor (complementaria, triádica, análoga, etc.) mediante aritmética na roda de tons para producir cada paleta.

1. 1
   Conversión de hexadecimal a HSL

   Cando escolles unha cor, a ferramenta analiza a cadea hexadecimal en compoñentes RGB e convérteos a HSL (ton, saturación, luminosidade). O ton é a posición de 0–360 graos na roda de cores; toda a matemática da paleta ocorre neste espazo.
2. 2
   Aritmética de tons para a harmonía

   Cada tipo de paleta é unha fórmula de rotación fixa aplicada ao ton base. A complementaria suma 180°, a triádica suma 120° e 240°, a tetrádica avanza en pasos de 90°, a split-complementaria usa 150° e 210°. As monocromáticas e as tonalidades manteñen o ton e a saturación constantes mentres avanzan a luminosidade cara arriba e abaixo.
3. 3
   Saída de HSL a hexadecimal

   Cada triplo HSL calculado convértese de volta a unha cor hexadecimal usando a fórmula de croma estándar. Os resultados móstranse como unha franxa de cores con etiquetas de contraste automático (texto escuro en mostras claras, texto claro en escuras) determinado por un limiar de luminancia sinxelo.
4. 4
   Exporta no teu formato preferido

   A paleta pódese copiar como cadeas hexadecimais ou exportar como un ficheiro de variables CSS (:root { --color-1: … }), variables SCSS, un fragmento de configuración de Tailwind, un obxecto JSON ou unha franxa de cores en PNG. A exportación PNG usa a API Canvas do navegador (toDataURL) para debuxar cada mostra coa súa etiqueta hexadecimal — todo se xera localmente ao facer clic.

Ferramentas relacionadas