CDRN

Generoi harmoninen väripaletti

  • Hallintapaneeli
  • Dokumentaatio
  • API
Generoi harmonisia väripaletteja haluttujen värien määrän ja valitun värisäännön mukaan, kuten komplementaariset, analogiset, triadiset värit jne.

Miten väripalettigeneraattoria käytetään?

Määritä haluamasi värien määrä ja värisääntö lomakkeessa. Voit käyttää generoituja paletteja projekteissasi esimerkin mukaisesti.

Ensimmäinen parametri määrittää päävärin.

Toinen parametri määrittää värien määrän. Huomaa, että valitusta säännöstä riippuen määrää ei välttämättä oteta huomioon.

Kolmas parametri määrittää käytettävän värisäännön (vastavärit, analogiset, triadiset jne.).

Palettiesimerkkejä

Monokromaattiset paletit

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

Analoginen paletti

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

Triadinen paletti

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

Usein kysytyt kysymykset

Mikä palettisääntö kannattaa valita graafiseen ohjeistoon?

Monokromaattinen paletti luo rauhallisen ja ammattimaisen vaikutelman, ja se sopii erinomaisesti yritys- tai uutissivustoille. Analogiset värit tarjoavat pehmeän ja luonnollisen vaihtelun, joka on hyödyllinen esimerkiksi vihreissä tai merellisissä tunnelmissa. Vastaväri- tai triadinen sääntö tuo vahvan kontrastin, joka sopii erinomaisesti toimintakehotteisiin (CTA) ja verkkokauppoihin, jotka haluavat herättää huomiota.

Miksi pyydettyä värien määrää ei aina noudateta?

Jotkut säännöt vaativat tietyn määrän värejä. Vastaväripaletti palauttaa aina 2 väriä (sävyn ja sen vastakohdan väriympyrässä), triadinen paletti palauttaa 3 ja tetradinen 4. Määräparametria noudatetaan vain monokromaattisissa ja analogisissa säännöissä.

Tehdäänkö laskenta HSL- vai RGB-avaruudessa?

Generointi perustuu HSL-avaruuteen, joka on luonnollisempi sävyn (väriympyrän kierto) ja valoisuuden käsittelyyn. Palautetut värit muunnetaan sitten HEX-muotoon suoraa CSS-integroitavuutta varten. Jos tarvitset RGB-muotoa, käytä värimuunninta jokaiselle generoidulle koodille.

Miten yhdistän generoidun paletin olemassa olevaan kuvaan?

Aloita poimimalla kuvan hallitseva väri paletin poimijalla, ota pääsävy viitevääriksi ja syötä se sitten generaattoriin analogisella tai triadisella säännöllä. Näin saat värejä, jotka ovat sopusoinnussa kuvasi kanssa ja joita voit käyttää sivuston muissa osissa.

Ovatko generoidut paletit WCAG-saavutettavuusstandardien mukaisia?

Generaattori ei tarkista kontrastisuhteita. Väri muuttuu saavutettavaksi vain suhteessa toiseen taustaväriin. Jos haluat vahvistaa teksti/tausta-parin, vie HEX-koodit ja käytä kontrastitarkistinta, joka laskee suhteen WCAG-vaatimusten mukaisesti (4.5:1 normaalille tekstille AA-tasolla, 7:1 AAA-tasolla).

Voiko paletin viedä tietyssä muodossa?

Paletti palautetaan HEX-koodeina, jotka ovat valmiita kopioitaviksi CSS-tyylitiedostoon, SASS-muuttujiin, Tailwind-teemaan tai design-token-järjestelmään. Jos haluat RGB- tai HSL-vastaavuudet, aja jokainen koodi värimuuntimen läpi.

Pyyntöesimerkki

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

Syöteskeema

Kenttä Tyyppi Pakollinen Oletus
color_base string ✓ –
quantity integer ✓ –
rules choice (complementary, analogous, triadic, tetradic, monochromatic, shade, split_complementary) ✓ –

Päätepisteet

  • GET https://cdrn.fr/api/v1/tools - listaa kaikki saatavilla olevat työkalut
  • GET https://cdrn.fr/api/v1/tools/color-generator - hakee tämän työkalun skeeman
  • POST https://cdrn.fr/api/v1/tools/color-generator/execute - suorittaa tämän työkalun JSON-payloadilla