Ģenerēt harmonisku krāsu paleti

Ģenerē harmoniskas krāsu paletes atkarībā no vēlamā krāsu skaita un izvēlētā krāsu noteikuma, piemēram, komplementāras, analogas, triāda krāsas utt.

Kā izmantot krāsu paletes ģeneratora rīku?

Veidlapā norādiet vēlamo krāsu skaitu un krāsu kārtulu. Varat izmantot ģenerētās paletes savos projektos, sekojot šim piemēram.

Pirmais parametrs nosaka galveno krāsu.

Otrais parametrs nosaka krāsu skaitu. Ņemiet vērā, ka atkarībā no izvēlētā noteikuma daudzuma izvēle var netikt ņemta vērā.

Trešais parametrs nosaka izmantojamo krāsu kārtulu (papildu, analogu, trīskāršu utt.).

Paletes piemēri

Monohromatiska palete

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

Analogā palete

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

Triādiskā palete

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

Bieži uzdotie jautājumi

Kuru paletes kārtulu izvēlēties grafiskajai hartai?

Monohromatiskā palete nodrošina mierīgu un profesionālu izskatu, kas ir ideāli piemērots korporatīvajām vai redakcijas vietnēm. Analogi piedāvā maigu, dabisku variāciju, kas ir noderīga zaļā vai okeāna gaisotnē. Papildu vai triādes noteikums nodrošina spēcīgu kontrastu, kas ir lieliski piemērots CTA un e-komercijas vietnēm, kas vēlas piesaistīt uzmanību.

Kāpēc ne vienmēr tiek ievērots pieprasītais krāsu skaits?

Daži noteikumi nosaka noteiktu krāsu skaitu. Papildu palete vienmēr atgriež 2 krāsas (krāsu apļa nokrāsu un tās pretstatu), triādiskā palete atgriež 3, tetradiskā 4. Daudzuma parametrs tiek ievērots tikai monohromatiskā un analogā kārtulā.

Vai aprēķins tiek veikts, izmantojot HSL vai RGB?

Paaudze paļaujas uz dabiskāku HSL telpu, lai manipulētu ar nokrāsu (krāsu apļa rotāciju) un spilgtumu. Atgrieztās krāsas pēc tam tiek pārveidotas HEX formātā tiešai integrācijai CSS. Ja nepieciešams RGB formāts, izmantojiet krāsu pārveidotāju katram ģenerētajam kodam.

Kā saistīt ģenerēto paleti ar esošu attēlu?

Sāciet ar attēla dominējošo krāsu izvilkšanu, izmantojot paletes nosūcēju, izmantojiet galveno nokrāsu kā atsauces krāsu un pēc tam ievadiet to ģeneratorā ar analogo vai triādes lineālu. Tādējādi jūs iegūsit krāsas, kas atbilst jūsu vizuālajam attēlam, lai apģērbtu pārējo vietni.

Vai ģenerētās paletes ir pieejamas WCAG standartiem?

Ģenerators nepārbauda kontrasta attiecības. Krāsa kļūst pieejama tikai saistībā ar citu fona krāsu. Lai apstiprinātu teksta/fona duetu, eksportējiet HEX kodus un izmantojiet kontrasta pārbaudītāju, kas aprēķina attiecību atbilstoši WCAG prasībām (4,5:1 parastam tekstam AA formātā, 7:1 AAA formātā).

Vai mēs varam eksportēt paleti noteiktā formātā?

Palete tiek atgriezta HEX kodos, kas ir gatava ielīmēšanai CSS lapā, SASS mainīgo failā, Tailwind motīvā vai dizaina pilnvaru sistēmā. Lai izgūtu RGB vai HSL ekvivalentus, nosūtiet katru kodu krāsu pārveidotājā.

Pieprasījuma piemērs

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

Ievades shēma

Lauks Tips Obligāts Noklusējums
color_base string
quantity integer
rules choice (complementary, analogous, triadic, tetradic, monochromatic, shade, split_complementary)

Endpoint

  • GET https://cdrn.fr/api/v1/tools - uzskaita visus pieejamos rīkus
  • GET https://cdrn.fr/api/v1/tools/color-generator - iegūst šī rīka shēmu
  • POST https://cdrn.fr/api/v1/tools/color-generator/execute - izpilda šo rīku ar JSON payload