Түс коду генератору жана Picker

Түс коддорун, вариацияларын, гармонияларын түзүңүз жана контраст катыштарын текшериңиз.

Түс конверсиясы

HEX

#8a8389

Monsoon

HEX
#8a8389
HSL
309, 3, 53
RGB
138, 131, 137
XYZ
23, 23, 27
CMYK
0, 5, 1, 46
LUV
56,13,0
LAB
56, 4, -2
HWB
309, 51, 46

Вариациялар

Бул бөлүмдүн максаты - тандалган түсүңүздүн ак (таза ак кошулган) жана көлөкөлөрүн (таза кара кошулган) 10% өсүш менен так чыгаруу.

Кесиптик кеңеш: Көлөкөлөрдү hover абалдары жана көлөкөлөр үчүн, ак түстөрдү басым жана фон үчүн колдонуңуз.

Көлөкөлөр

Негизги түсүңүзгө кара кошуу менен түзүлгөн караңгы вариациялар.

Ак түстөр

Негизги түсүңүзгө ак кошуу менен түзүлгөн ачык вариациялар.

Кеңири колдонуу учурлары

  • UI компонент абалдары (hover, активдүү, өчүрүлгөн)
  • Көлөкөлөр жана басымдар менен тереңдик түзүү
  • Туруктуу түс системаларын куруу

Дизайн системасы боюнча кеңеш

Бул вариациялар бирдиктүү түс палитрасынын негизин түзөт. Долбооруңуздун бардык жеринде ырааттуулукту сактоо үчүн аларды экспорттоңуз.

Түс айкалыштары

Ар бир гармониянын өзүнүн маанайы бар. Жакшы иштеген түс айкалыштарын ойлоп табуу үчүн гармонияларды колдонуңуз.

Кантип колдонуу керек

Ар кандай түстү басып, анын hex маанисин көчүрүңүз. Бул айкалыштар визуалдык гармония түзүү үчүн математикалык жактан далилденген.

Эмне үчүн маанилүү

Түс гармониялары тең салмактуулукту түзөт жана дизайныңызда белгилүү бир эмоцияларды ойготот.

Толуктоо

Түс жана анын түс дөңгөлөгүндөгү карама-каршысы, +180 градус. Жогорку контраст.

#8a8389
Эң жакшы колдонулат: Жогорку таасирдүү дизайндар, 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

Техникалык форматтар

Практикалык форматтар

Түс анализи

Түс сокурлук симулятору

Креативдүү аспектилер