Krāsu koda ģenerators un atlasītājs

Ģenerējiet krāsu kodus, variācijas, harmonijas un pārbaudiet kontrasta attiecības.

Krāsu konvertēšana

HEX

#e24826

Cinnabar

HEX
#e24826
HSL
11, 76, 52
RGB
226, 72, 38
XYZ
34, 21, 4
CMYK
0, 68, 83, 11
LUV
53,137,37
LAB
53, 58, 52
HWB
11, 15, 11

Variācijas

Šīs sadaļas mērķis ir precīzi izveidot izvēlētās krāsas toņus (pievienots tīrs balts) un toņus (pievienots tīrs melns) ar 10% soli.

Profesionāļu padoms: Izmantojiet toņus uznirstošajiem stāvokļiem un ēnām, toņus - izceltajiem elementiem un foniem.

Nokrāsas

Tumšākas variācijas, kas izveidotas, bāzes krāsai pievienojot melnu.

Tonējumi

Gaišākas variācijas, kas izveidotas, bāzes krāsai pievienojot baltu.

Bieži lietojuma gadījumi

  • Lietotāja saskarnes komponentu stāvokļi (novietošana, aktīvs, atspējots).
  • Dziļuma radīšana ar ēnām un izgaismojumiem
  • Konsekventu krāsu sistēmu veidošana

Dizaina sistēmas padoms

Šīs variācijas veido vienotas krāsu paletes pamatu. Eksportējiet tās, lai saglabātu konsekvenci visā projektā.

Krāsu kombinācijas

Katrai harmonijai ir sava noskaņa. Izmantojiet harmonijas, lai meklētu krāsu kombinācijas, kas labi sader kopā.

Kā lietot

Noklikšķiniet uz jebkuras krāsas, lai nokopētu tās sešciparu vērtību. Ir matemātiski pierādīts, ka šīs kombinācijas rada vizuālu harmoniju.

Kāpēc tas ir svarīgi

Krāsu harmonijas rada līdzsvaru un izraisa īpašas emocijas jūsu dizainā.

Papildinājums

Krāsa un tās pretstats krāsu aplī, +180 nokrāsas grādi. Augsts kontrasts.

#e24826
Vislabāk piemērots: Augstas iedarbības dizaini, CTA, logotipi

Sadalīts-komplementārs

Krāsa un divas blakus esošās tās papildinājumam, +/-30 grādu nokrāsas no vērtības, kas ir pretējā pamatkrāsai. Treknrakstā kā taisns papildinājums, bet daudzpusīgāk.

Vislabāk piemērots: Spilgts, bet līdzsvarots izkārtojums

Triādiskais

Trīs krāsas, vienmērīgi izvietotas pa krāsu apli, katra 120 grādu attālumā viena no otras. Vislabāk ir ļaut vienai krāsai dominēt, bet pārējās izmantot kā akcentus.

Vislabāk piemērots: Rotaļīgs, enerģisks dizains

Analogs

Trīs krāsas ar vienādu spilgtumu un piesātinājumu, kuru nokrāsas atrodas blakus krāsu aplī 30 grādu attālumā viena no otras. Vienmērīgas pārejas.

Vislabāk piemērots: Dabas iedvesmotas, nomierinošas saskarnes

Monohromatisks

Trīs viena un tā paša toņa krāsas ar spilgtuma vērtībām +/-50%. Smalks un izsmalcināts.

Vislabāk piemērots: Minimālistisks, izsmalcināts dizains

Tetradiķis

Divi papildkrāsu komplekti, kurus atdala 60 nokrāsas grādi.

Vislabāk piemērots: Bagātīgas, daudzveidīgas krāsu shēmas

Krāsu teorijas principi

Līdzsvars

Izmantojiet vienu dominējošo krāsu, atbalstiet to ar sekundāro krāsu un akcentējiet reti.

Kontrasts

Nodrošiniet pietiekamu kontrastu, lai nodrošinātu salasāmību un pieejamību.

Harmonija

Krāsām ir jāsadarbojas, lai radītu vienotu vizuālo pieredzi.

Krāsu kontrasta pārbaudītājs

Pārbaudiet krāsu kombinācijas, lai pārliecinātos, ka tās atbilst WCAG pieejamības standartiem attiecībā uz teksta lasāmību.

Teksta krāsa
Fona krāsa
Kontrasts
1.00
Fail
Ļoti slikti
Mazs teksts
✖︎
Liels teksts
✖︎
WCAG standarti
AA:Minimālā kontrasta attiecība ir 4,5:1 parastam tekstam un 3:1 lielam tekstam. Nepieciešams lielākajai daļai tīmekļa vietņu.
AAA:Uzlabota kontrasta attiecība 7:1 parastam tekstam un 4,5:1 lielam tekstam. Ieteicams optimālai pieejamībai.
Nepietiekams kontrasts visiem teksta izmēriem — neatbilst WCAG standartiem.

Uzlabota kontrasta pārbaude

Veiciet precīzu regulēšanu, izmantojot slīdņus, vairākus priekšskatījumus u. c.

Ikviens ir ģēnijs. Bet, ja jūs vērtējat zivi pēc tās spējas uzkāpt kokā, tā visu savu dzīvi nodzīvos, ticot, ka ir muļķe.

- Albert Einstein

Tehniskie formāti

Praktiskie formāti

Krāsu analīze

Akluma simulators

Radošie aspekti