Գույնի կոդ գեներատոր և Picker

Գեներացրու գույնի կոդեր, տարբերակներ, ներդաշնակություններ և ստուգիր հակադրության հարաբերակցությունները։

Գույնի փոխարկում

HEX

#37290e

Brown Tumbleweed

HEX
#37290e
HSL
40, 59, 14
RGB
55, 41, 14
XYZ
2, 2, 1
CMYK
0, 25, 75, 78
LUV
18,12,15
LAB
18, 3, 20
HWB
40, 5, 78

Տարբերակներ

Այս բաժնի նպատակը ձեր ընտրած գույնի երանգներ (մաքուր սպիտակ ավելացված) և ստվերներ (մաքուր սև ավելացված) ճշգրիտ արտադրելն է 10% աճերով։

Մասնագիտական խորհուրդ: Օգտագործեք ստվերներ հովեր վիճակների և ստվերների համար, երանգներ՝ ընդգծումների և ֆոների համար։

Ստվերներ

Մուգ տարբերակներ, որոնք ստեղծվում են ձեր հիմնական գույնին սև ավելացնելով։

Երանգներ

Լուսավոր տարբերակներ, որոնք ստեղծվում են ձեր հիմնական գույնին սպիտակ ավելացնելով։

Հաճախակի օգտագործման դեպքեր

  • UI բաղադրիչների վիճակներ (հովեր, ակտիվ, անջատված)
  • Խորություն ստեղծել ստվերներով և ընդգծումներով
  • Կառուցել համահունչ գունային համակարգեր

Դիզայն համակարգի խորհուրդ

Այս տարբերակները ձևավորում են համահունչ գունային պալետի հիմքը։ Արտահանեք դրանք՝ ձեր ամբողջ նախագծում համահունչություն պահպանելու համար։

Գունային համադրություններ

Յուրաքանչյուր ներդաշնակություն ունի իր տրամադրությունը։ Օգտագործեք ներդաշնակությունները՝ գունային համադրություններ մտածելու համար, որոնք լավ են աշխատում միասին։

Ինչպես օգտագործել

Սեղմեք ցանկացած գույնի վրա՝ դրա hex արժեքը պատճենելու համար։ Այս համադրությունները մաթեմատիկորեն ապացուցված են, որ ստեղծում են տեսողական ներդաշնակություն։

Ինչու է դա կարևոր

Գունային ներդաշնակությունները ստեղծում են հավասարակշռություն և ձեր դիզայններում առաջացնում են հատուկ զգացմունքներ։

Հակադիր

Գույն և նրա հակադիր գույնը գունային անիվի վրա, +180 աստիճան հյու։ Բարձր հակադրություն։

#37290e
Լավագույնը: Բարձր ազդեցության դիզայններ, CTA-ներ, լոգոներ

Բաժանված հակադիր

Գույն և երկու հարակից նրա հակադիրին, +/-30 աստիճան հյու հիմնական գույնի հակադիր արժեքից։ Խիզախ ինչպես ուղիղ հակադիրը, բայց ավելի բազմակողմանի։

Լավագույնը: Վառ, բայց հավասարակշռված դասավորություններ

Եռյակ

Երեք գույներ, որոնք հավասարապես տարածված են գունային անիվի վրա, յուրաքանչյուրն 120 աստիճան հյու հեռավորությամբ։ Լավագույնը՝ թույլ տալ մեկ գույնին գերիշխել և օգտագործել մյուսները որպես շեշտադրումներ։

Լավագույնը: Խաղային, էներգետիկ դիզայններ

Անալոգային

Երեք գույներ նույն լուսավորությամբ և հագեցվածությամբ, որոնց հյուները հարակից են գունային անիվի վրա, 30 աստիճան հեռավորությամբ։ Հարթ անցումներ։

Լավագույնը: Բնությունից ներշնչված, հանգստացնող ինտերֆեյսներ

Մոնոխրոմատիկ

Երեք գույներ նույն հյուով, լուսավորության արժեքները +/-50%։ Նուրբ և նրբագեղ։

Լավագույնը: Մինիմալիստական, նրբագեղ դիզայններ

Տետրադիկ

Երկու զույգ լրացնող գույներ, որոնք բաժանված են 60 աստիճան երանգով։

Լավագույնը: Հարուստ, բազմազան գունային սխեմաներ

Գույնի տեսության սկզբունքներ

Հավասարակշռություն

Օգտագործիր մեկ գերիշխող գույն, աջակցիր երկրորդականով և շեշտադրիր հազվադեպ։

Հակադրություն

Համոզվիր, որ կա բավարար հակադրություն ընթեռնելիության և մատչելիության համար։

Հարմոնիա

Գույները պետք է աշխատեն միասին՝ ստեղծելով միասնական տեսողական փորձ։

Գույնի հակադրության ստուգիչ

Ստուգիր գույների համադրությունները՝ համոզվելու համար, որ դրանք համապատասխանում են WCAG հասանելիության չափանիշներին տեքստի ընթեռնելիության համար։

Տեքստի գույն
Ֆոնի գույն
Հակադրություն
1.00
Fail
Շատ վատ
Փոքր տեքստ
✖︎
Մեծ տեքստ
✖︎
WCAG չափանիշներ
AA:Նվազագույն հակադրության հարաբերակցություն 4.5:1 սովորական տեքստի և 3:1 մեծ տեքստի համար։ Պահանջվում է մեծամասնության կայքերի համար։
AAA:Բարձրացված հակադրության հարաբերակցություն 7:1 սովորական տեքստի և 4.5:1 մեծ տեքստի համար։ Առաջարկվում է օպտիմալ հասանելիության համար։
Անբավարար կոնտրաստ բոլոր տեքստի չափերի համար - չի համապատասխանում WCAG ստանդարտներին։

Ընդլայնված կոնտրաստի ստուգիչ

Կարգավորեք սահիկներով, բազմակի նախադիտումներով և ավելին

Բոլորը հանճար են։ Բայց եթե դու ձկանը դատում ես ծառ բարձրանալու ունակությամբ, այն իր ամբողջ կյանքը կապրի՝ հավատալով, որ հիմար է։

- Albert Einstein

Տեխնիկական ձևաչափեր

Գործնական ձևաչափեր

Գույնի վերլուծություն

Կուրության սիմուլյատոր

Ստեղծագործական ասպեկտներ