Värvikoodide generaator &; valija

Looge värvikoodid, variatsioonid, harmooniad ja kontrollige kontrastsuhteid.

Värvi konverteerimine

HEX

#ca4e4e

Chestnut Rose

HEX
#ca4e4e
HSL
0, 54, 55
RGB
202, 78, 78
XYZ
28, 19, 9
CMYK
0, 61, 61, 21
LUV
50,105,21,
LAB
50, 49, 26
HWB
0, 31, 21

Variatsioonid

Selle sektsiooni eesmärk on toota täpselt valitud värvi toonid (puhas valge lisatud) ja toonid (puhas must lisatud) 10%-lise sammuga.

Pro nõuanne: Kasutage varjundeid hõljutusseisundite ja varjude jaoks, toonide kasutamist rõhutuste ja taustade jaoks.

Varjud

Tumedamad variatsioonid, mis on loodud musta lisamisega põhivärvile.

Tints

Heledamad variatsioonid, mis on loodud valget värvi lisades oma põhivärvile.

Üldised kasutusjuhtumid

  • Kasutajaliidese komponendi olekud (hõljumine, aktiivne, välja lülitatud)
  • Sügavuse loomine varjude ja tipphetkedega
  • Järjepidevate värvisüsteemide ehitamine

Disainisüsteemi näpunäide

Need variatsioonid moodustavad ühtse värvipaleti aluse. Eksportige need, et säilitada järjepidevus kogu projektis.

Värvikombinatsioonid

Igal harmoonial on oma meeleolu. Kasutage harmooniaid, et mõelda välja värvikombinatsioonid, mis sobivad hästi kokku.

Kuidas kasutada

Klõpsake mis tahes värvil, et kopeerida selle heksaväärtust. Need kombinatsioonid on matemaatiliselt tõestatud, et luua visuaalset harmooniat.

Miks see on oluline

Värviharmoonia loob tasakaalu ja tekitab teie kujunduses konkreetseid emotsioone.

Täiendus

Värv ja selle vastand värvirattal, +180 kraadi värvitooni. Suur kontrast.

#ca4e4e
Parimad selleks, et: Suure mõjujõuga kujundus, CTA-d, logod

Split-komplementaarne

Värv ja kaks selle komplemendi kõrval asuvat värvi, +/-30 kraadiga põhivärvi vastandväärtusest. Julged nagu sirge komplement, kuid mitmekülgsemad.

Parimad selleks, et: Elavat, kuid tasakaalustatud paigutus

Triadic

Kolm värvi, mis on ühtlaselt jaotatud mööda värviratast, iga värvivärvi 120 kraadise vahega. Parim on lasta ühel värvil domineerida ja kasutada teisi aktsentidena.

Parimad selleks, et: Mänguline, energiline disain

Analoogiline

Kolm värvi, mille heledus ja küllastus on sama, ja mille toonid on värvirattal kõrvuti, 30 kraadi kaugusel üksteisest. Sujuvad üleminekud.

Parimad selleks, et: Loodusest inspireeritud, rahustavad kasutajaliidesed

Monokromaatiline

Kolm sama tooniga värvi heledusega +/-50%. Peenike ja rafineeritud.

Parimad selleks, et: Minimalistlik, keerukas disain

Tetradic

Kaks komplementaarvärvide komplekti, mis on eraldatud 60 kraadiga.

Parimad selleks, et: Rikkalikud, mitmekesised värvilahendused

Värviteooria põhimõtted

Saldo

Kasutage ühte domineerivat värvi, toetage sekundaarse värviga ja rõhuasetustega säästlikult.

Kontrast

Tagage piisav kontrastsus loetavuse ja ligipääsetavuse tagamiseks.

Harmony

Värvid peaksid töötama koos, et luua ühtne visuaalne kogemus.

Värvikontrasti kontrollija

Testige värvikombinatsioone, et tagada nende vastavus WCAG ligipääsetavuse standarditele teksti loetavuse osas.

Teksti värv
Taustavärv
Kontrast
Fail
Väike tekst
✖︎
Suur tekst
✖︎
WCAG standardid
AA:Minimaalne kontrastsuse suhe 4,5:1 tavalise teksti puhul ja 3:1 suure teksti puhul. Nõutav enamiku veebisaitide puhul.
AAA:Täiustatud kontrastsuse suhe 7:1 tavalise teksti puhul ja 4,5:1 suure teksti puhul. Soovitatav optimaalse ligipääsetavuse tagamiseks.

Igaüks on geenius. Aga kui sa hindad kala selle järgi, kas ta suudab puu otsa ronida, elab ta kogu oma elu uskudes, et ta on rumal.

- Albert Einstein

Tehnilised vormingud

Praktilised vormingud

Värvianalüüs

Pimeduse simulaator

Loomingulised aspektid