Generovať harmonickú paletu farieb

Generuje harmonické palety farieb podľa požadovaného počtu farieb a zvoleného pravidla, ako sú komplementárne, analogické, triadické farby atď.

Ako používať nástroj na generovanie farebnej palety?

Špecifikujte požadovaný počet farieb a farebné pravidlo vo formulári. Môžete použiť vygenerované palety vo vašich projektoch podľa príkladu.

Prvý parameter definuje hlavnú farbu.

Druhý parameter definuje počet farieb. Všimnite si, že podľa zvoleného pravidla nemusí byť výber množstva zohľadnený.

Tretí parameter definuje farebné pravidlo na použitie (komplementárne, analógne, triadické, atď.).

Príklady paliet

Monochromatická paleta

<div class="p-4" style="background-color: #ff5733;"></div>
<div class="p-4" style="background-color: #ffab99;"></div>
<div class="p-4" style="background-color: #ffffff;"></div>

Analógna paleta

<div class="p-4" style="background-color: #ff5733;"></div>
<div class="p-4" style="background-color: #ffbb32;"></div>
<div class="p-4" style="background-color: #dcff32;"></div>

Triadická paleta

<div class="p-4" style="background-color: #ff5733;"></div>
<div class="p-4" style="background-color: #32ff54;"></div>
<div class="p-4" style="background-color: #5432ff;"></div>

Často kladené otázky

Aké pravidlo palety zvoliť pre grafickú chartu?

Monochromatická paleta dáva pokojný a profesionálny render, ideálny pre korporátne alebo redakčné stránky. Analógne ponúkajú jemnú, prirodzenú variáciu, užitočnú pre zelené alebo oceánske atmosféry. Pravidlo komplementárne alebo triadické prináša silný kontrast, perfektný pre CTA a e-commerce stránky, ktoré chcú zachytiť pozornosť.

Prečo nie je vždy rešpektovaný požadovaný počet farieb?

Niektoré pravidlá vnucujú fixný počet farieb. Komplementárna paleta vracia vždy 2 farby (odtieň a jeho opak na farebnom kolese), triadická paleta vracia 3, tetradická vracia 4. Parameter množstva je rešpektovaný iba pre pravidlá monochromatické a analógne.

Vykonáva sa výpočet na HSL alebo RGB?

Generovanie sa opiera o HSL priestor, prirodzenejší pre manipuláciu s odtieňom (rotácia na farebnom kolese) a svetlosťou. Vrátené farby sú potom konvertované na HEX formát pre priamu integráciu v CSS. Ak potrebujete RGB formát, použite konvertor farieb na každom vygenerovanom kóde.

Ako asociovať vygenerovanú paletu s existujúcim obrázkom?

Začnite extrakciou dominantnej farby vášho obrázka cez extraktor palety, vezmite hlavný odtieň ako referenčnú farbu, potom ho injektujte do generátora s analógnym alebo triadickým pravidlom. Takto získate farby koherentné s vaším vizuálom pre obliekanie zvyšku stránky.

Sú vygenerované palety prístupné podľa WCAG noriem?

Generátor neoveruje kontrastné pomery. Farba sa stáva prístupnou iba vo vzťahu s inou farbou pozadia. Pre validáciu páru text/pozadie exportujte HEX kódy a použite kontrastný overovač, ktorý počíta pomer podľa WCAG požiadaviek (4.5:1 pre bežný text v AA, 7:1 v AAA).

Možno exportovať paletu v určitom formáte?

Paleta je vrátená v HEX kódoch, pripravených na vloženie do CSS súboru, do súboru SASS premenných, do Tailwind témy alebo do systému design tokenov. Pre získanie RGB alebo HSL ekvivalentov prejdite každý kód cez konvertor farieb.

Ukážka požiadavky

curl -X POST https://cdrn.fr/api/v1/tools/color-generator/execute \
  -H "Content-Type: application/json" \
  -d '{"color_base":"...","quantity":1,"rules":"complementary"}'

Vstupná schéma

Pole Typ Povinné Predvolené
color_base string
quantity integer
rules choice (complementary, analogous, triadic, tetradic, monochromatic, shade, split_complementary)

Koncové body

  • GET https://cdrn.fr/api/v1/tools - vypíše všetky dostupné nástroje
  • GET https://cdrn.fr/api/v1/tools/color-generator - získa schému tohto nástroja
  • POST https://cdrn.fr/api/v1/tools/color-generator/execute - spustí tento nástroj s JSON payloadom