CDRN

Genereeri harmooniline värvipalett

  • Töölaud
  • Dokumentatsioon
  • API
Genereerib harmoonilisi värvipalette vastavalt soovitud värvide arvule ja valitud värvireeglile, nagu komplementaarsed, analoogilised, triaadilised värvid jne.

Kuidas kasutada värvipaleti generaatori tööriista?

Määrake vormil soovitud värvide arv ja värvireegel. Loodud palette saate oma projektides kasutada, järgides näidet.

Esimene parameeter määrab põhivärvi.

Teine parameeter määrab värvide arvu. Pange tähele, et olenevalt valitud reeglist ei pruugita koguse valikut arvesse võtta.

Kolmas parameeter määrab kasutatava värvireegli (komplementaarne, analoogne, kolmik jne).

Palettide näited

Monokromaatiline palett

<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>

Analoogpalett

<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>

Triaadi palett

<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>

Korduma kippuvad küsimused

Millise paleti reegli valida graafilise harta jaoks?

Ühevärviline palett annab rahuliku ja professionaalse ilme, mis sobib ideaalselt ettevõtete või toimetuste saitidele. Analoogid pakuvad pehmet ja loomulikku vaheldust, mis on kasulikud rohelise või ookeanikeskkonna jaoks. Täiendav või triaadiline reegel annab tugeva kontrasti, mis sobib suurepäraselt CTA-de ja e-kaubandussaitide jaoks, mis soovivad tähelepanu köita.

Miks ei peeta alati kinni soovitud värvide arvust?

Mõned reeglid kehtestavad kindla arvu värve. Täiendav palett tagastab alati 2 värvi (toon ja selle vastand värvirattal), triaadiline palett 3 ja tetraadiline 4. Koguse parameetrit järgitakse ainult monokromaatilise ja analoog reeglite puhul.

Kas arvutus tehakse HSL-i või RGB-ga?

Põlvkond tugineb loomulikumale HSL-ruumile, et manipuleerida tooniga (värvirattal pööramine) ja heleusega. Tagastatud värvid teisendatakse seejärel HEX-vormingusse, et integreerida otse CSS-i. Kui vajate RGB-vormingut, kasutage iga loodud koodi puhul värvimuundurit.

Kuidas seostada loodud paletti olemasoleva pildiga?

Alustuseks eraldage oma pildilt domineeriv värv paleti ekstraktori abil, võtke põhitoon võrdlusvärviks ja sisestage see seejärel analoog- või triaadijoonlaua abil generaatorisse. Nii saate ülejäänud saidi riietamiseks värvid, mis vastavad teie visuaalile.

Kas loodud paletid on WCAG standarditele juurdepääsetavad?

Generaator ei kontrolli kontrastsuse suhet. Värv muutub kättesaadavaks ainult seoses teise taustavärviga. Teksti/tausta duo kinnitamiseks eksportige HEX-koodid ja kasutage kontrastsuse kontrollijat, mis arvutab suhte vastavalt WCAG nõuetele (4,5:1 tavalise teksti jaoks AA-s, 7:1-s AAA-s).

Kas me saame paletti eksportida kindlas vormingus?

Palett tagastatakse HEX-koodidena, mis on valmis kleepimiseks CSS-lehele, SASS-i muutujate faili, Tailwindi teemasse või kujunduslubade süsteemi. RGB- või HSL-i ekvivalentide toomiseks edastage iga kood värvimuundurisse.

Päringunäide

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

Sisendskeem

Väli Tüüp Kohustuslik Vaikimisi
color_base string ✓ –
quantity integer ✓ –
rules choice (complementary, analogous, triadic, tetradic, monochromatic, shade, split_complementary) ✓ –

Lõpp-punktid

  • GET https://cdrn.fr/api/v1/tools - loetleb kõik saadaolevad tööriistad
  • GET https://cdrn.fr/api/v1/tools/color-generator - toob selle tööriista skeemi
  • POST https://cdrn.fr/api/v1/tools/color-generator/execute - täidab selle tööriista JSON-payloadiga