CDRN

Generarea unei palete de culori armonioase

  • Panou de control
  • Documentație
  • API
Generează palete de culori armonioase în funcție de numărul de culori dorit și de regula de culoare aleasă, precum culorile complementare, analoge, triadice etc.

Cum să utilizezi instrumentul de generare a paletei de culori?

Specifică numărul de culori dorit și regula de culori în formular. Poți utiliza paletele generate în proiectele tale urmând exemplul.

Primul parametru definește culoarea principală.

Al doilea parametru definește numărul de culori. Notează că în funcție de regula aleasă, alegerea cantității poate să nu fie luată în considerare.

Al treilea parametru definește regula de culori de utilizat (complementare, analoge, triadice, etc.).

Exemple de Palete

Paletă Monocromatică

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

Paletă Analogă

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

Paletă Triadică

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

Întrebări frecvente

Ce regulă de paletă să aleg pentru o identitate grafică?

O paletă monocromatică dă o randare calmă și profesională, ideală pentru site-urile corporate sau editoriale. Analogele oferă o variație blândă, naturală, utilă pentru ambianțele verzi sau oceanice. Regula complementară sau triadică aduce un contrast puternic, perfect pentru CTA-uri și site-urile e-commerce care doresc să capteze atenția.

De ce numărul de culori cerut nu este întotdeauna respectat?

Anumite reguli impun un număr fix de culori. O paletă complementară returnează întotdeauna 2 culori (nuanța și opusul său pe roata cromatică), o paletă triadică returnează 3, una tetradică returnează 4. Parametrul de cantitate este respectat doar pentru regulile monocromatică și analogă.

Calculul este făcut pe HSL sau RGB?

Generarea se bazează pe spațiul HSL, mai natural pentru a manipula nuanța (rotație pe roata cromatică) și luminozitatea. Culorile returnate sunt apoi convertite în format HEX pentru integrare directă în CSS. Dacă ai nevoie de formatul RGB, utilizează convertorul de culoare pe fiecare cod generat.

Cum să asociezi paleta generată cu o imagine existentă?

Începe prin a extrage culoarea dominantă a imaginii tale prin extractorul de paletă, ia nuanța principală ca culoare de referință, apoi injectează-o în generator cu o regulă analogă sau triadică. Vei obține astfel culori coerente cu vizualul tău pentru a îmbrăca restul site-ului.

Paletele generate sunt accesibile la normele WCAG?

Generatorul nu verifică raporturile de contrast. O culoare nu devine accesibilă decât în relație cu o altă culoare de fundal. Pentru a valida un duo text/fundal, exportă codurile HEX și utilizează un verificator de contrast care calculează raportul după cerințele WCAG (4.5:1 pentru text normal în AA, 7:1 în AAA).

Poți exporta paleta într-un format particular?

Paleta este returnată în coduri HEX, gata de lipit într-o foaie CSS, într-un fișier de variabile SASS, într-o temă Tailwind sau într-un sistem de token-uri design. Pentru a recupera echivalentele RGB sau HSL, trece fiecare cod prin convertorul de culoare.

Exemplu de cerere

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

Schema de intrare

Câmp Tip Obligatoriu Implicit
color_base string ✓ –
quantity integer ✓ –
rules choice (complementary, analogous, triadic, tetradic, monochromatic, shade, split_complementary) ✓ –

Puncte de acces

  • GET https://cdrn.fr/api/v1/tools - listează toate instrumentele disponibile
  • GET https://cdrn.fr/api/v1/tools/color-generator - obține schema acestui instrument
  • POST https://cdrn.fr/api/v1/tools/color-generator/execute - execută acest instrument cu un payload JSON