Algorithmic Colour Palette
Deriva token hover/active/tint/grey/semantic da un esadecimale di brand tramite formule HSL fisse.
Promosso
Cosa fa
Espande uno o due colori di brand in un sistema di colori UI completo utilizzando formule esplicite di regolazione HSL: stati interattivi più scuri/chiari, grigi desaturati dalla tonalità del brand invece di neutri generici e colori di stato semantici allineati alla saturazione e luminosità del brand. Si attiva quando si costruisce o si estende un sistema di colori, si scelgono sfumature hover/active o si generano token per file CSS/Tailwind/design-system.
Rapporto di test
Eseguito il calcolo HSL reale sul colore del brand #2D6A4F (H153/S40/L30): l'output della skill ha prodotto grigi visibilmente tendenti al verde (#161d1a, #45544d, #f4f5f5) e colori semantici bloccati alla saturazione del 40% del brand, rispetto ai grigi stock di Tailwind e ai colori predefiniti rosso/ambra/verde della baseline non guidata che non condividono alcuna relazione di tonalità o intensità con il brand.
Testato il: 2026-07-14 · Claude Code 2.x (agent harness)
Installazione
git clone https://github.com/dembrandt/dembrandt-skills cd dembrandt-skills mkdir -p ~/.claude/skills cp -r skills/algorithmic-color-palette ~/.claude/skills/algorithmic-color-palette
Comandi e prompt di esempio
/algorithmic-color-paletteDeriva token hover/active/tint/grey/semantic da un esadecimale di brand tramite formule HSL fisse.
Gli skill si attivano con richieste in linguaggio naturale, senza comandi da ricordare. Dopo l'installazione, prompt come questi lo attivano (in inglese):
Generate a full color palette from our brand hex #2D6A4FI need hover and active state colors for our primary buttonCreate brand-tinted grey tokens for our Tailwind config