Generátor Odstínů a Tónů — Vytváření Barevných Variant
Kompletní barevná škála — od nejsvětlejšího odstínu po nejtmavší tón — je základem každého designového systému. Náš generátor vytvoří 9–11 barevných variant z libovolné vstupní barvy, podobně jako barevné škály Tailwind CSS.
Odstín vs. tón
Odstín je barva smíchaná s bílou (vyšší světlost). Tón je barva smíchaná s černou (nižší světlost). V designových systémech jsou barvy číslovány: 50 (nejsvětlejší) až 900 (nejtmavší), přičemž 500 je základní tón.
HSL pro barevné varianty
Nejjednodušší metoda: upravte pouze hodnotu L v HSL, zatímco H a S zůstanou konstantní. Lepší výsledek: použijte barevný prostor OKLCH pro perceptuálně rovnoměrnou změnu světlosti. Varianty OKLCH vypadají vizuálně rovnoměrně, varianty HSL ne vždy.
Použití v designových systémech
Barevná škála poskytuje vývojářům a designérům společný slovník: „použijte primary-700 pro tlačítka, primary-100 pro pozadí". Konzistence snižuje únavu z rozhodování a urychluje designový proces.