Generator Nuanțe și Umbre — Crearea Variantelor de Culoare

O scală completă de culori — de la nuanța cea mai deschisă până la umbra cea mai închisă — este baza oricărui sistem de design. Generatorul nostru creează 9–11 variante de culoare din orice culoare de intrare, similar cu scalele de culori din Tailwind CSS.

Nuanță versus umbră

O nuanță este o culoare amestecată cu alb (luminozitate mai mare). O umbră este o culoare amestecată cu negru (luminozitate mai mică). În sistemele de design, culorile sunt numerotate: 50 (cea mai deschisă) până la 900 (cea mai închisă), cu 500 ca nuanța de bază.

HSL pentru variantele de culoare

Metoda cea mai simplă: ajustează doar valoarea L în HSL, menținând H și S constante. Rezultat mai bun: folosește spațiul de culoare OKLCH pentru o modificare de luminozitate percepțional uniformă. Variantele OKLCH arată vizual uniforme, variantele HSL nu întotdeauna.

Utilizarea în sistemele de design

O scală de culori oferă dezvoltatorilor și designerilor un vocabular comun: „folosește primary-700 pentru butoane, primary-100 pentru fundaluri". Consistența reduce oboseala decizională și accelerează procesul de design.