Rang kodini ishlab chiqaruvchi va tanlash

Rang kodlari, o'zgarishlar, uyg'unliklarni yarating va kontrast nisbatlarini tekshiring.

Rangni o'zgartirish

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

Variatsiyalar

Ushbu bo'limning maqsadi tanlangan rangingizning 10% o'sishda ranglarini (sof qo'shilgan oq) va soyalarni (sof qora qo'shilgan) aniq ishlab chiqarishdir.

Professional maslahat: Hover holatlari va soyalar uchun soyalardan, diqqatga sazovor joylar va fon uchun ranglardan foydalaning.

Soyalar

Asosiy rangingizga qora qo'shish orqali yaratilgan quyuqroq o'zgarishlar.

Ranglar

Asosiy rangingizga oq qo'shish orqali yaratilgan engilroq o'zgarishlar.

Umumiy foydalanish holatlari

  • UI komponenti holatlari (koʻrsatgich, faol, oʻchirilgan)
  • Soya va yorug'lik bilan chuqurlik yaratish
  • Barqaror rang tizimlarini yaratish

Dizayn tizimi bo'yicha maslahat

Ushbu o'zgarishlar uyg'un ranglar palitrasining asosini tashkil qiladi. Butun loyihangizda izchillikni saqlash uchun ularni eksport qiling.

Rang kombinatsiyalari

Har bir uyg'unlikning o'ziga xos kayfiyati bor. Birgalikda yaxshi ishlaydigan rang kombinatsiyalarini aqliy hujum qilish uchun garmoniyalardan foydalaning.

Qanday foydalaniladi

Uning olti burchakli qiymatini nusxalash uchun istalgan rangni bosing. Ushbu kombinatsiyalar vizual uyg'unlikni yaratish uchun matematik jihatdan isbotlangan.

Nima uchun bu muhim

Rang uyg'unligi muvozanatni yaratadi va dizayningizda o'ziga xos his-tuyg'ularni uyg'otadi.

To‘ldiruvchi

Rang va rang g'ildiragida uning qarama-qarshi tomoni, +180 daraja rang. Yuqori kontrast.

#ca4e4e
uchun eng yaxshisi: Yuqori ta'sirli dizaynlar, CTAlar, logotiplar

Ajratish-to'ldiruvchi

Bir rang va uning to'ldiruvchisiga ikkita qo'shni, asosiy rangga qarama-qarshi qiymatdan +/-30 daraja rang. To'g'ridan-to'g'ri to'ldiruvchi kabi qalin, lekin ko'p qirrali.

uchun eng yaxshisi: Jonli, ammo muvozanatli tartiblar

Triadik

Rang g'ildiragi bo'ylab bir tekisda joylashgan uchta rang, har biri bir-biridan 120 daraja rang. Eng yaxshisi, bitta rangning ustunligiga ruxsat berish va boshqalarni aksan sifatida ishlatish.

uchun eng yaxshisi: O'ynoqi, baquvvat dizaynlar

Analog

Rangli g'ildirakda bir-biridan 30 daraja masofada joylashgan ranglar bilan bir xil yorqinlik va to'yinganlikdagi uchta rang. Silliq o'tishlar.

uchun eng yaxshisi: Tabiatdan ilhomlangan, tinchlantiruvchi interfeyslar

Monoxromatik

Yorqinlik qiymatlari +/-50% bo'lgan bir xil rangdagi uchta rang. Nozik va nozik.

uchun eng yaxshisi: Minimalist, murakkab dizaynlar

Tetradik

60 daraja rang bilan ajratilgan ikkita qo'shimcha ranglar to'plami.

uchun eng yaxshisi: Boy, xilma-xil rang sxemalari

Rang nazariyasi tamoyillari

Balans

Bir dominant rangdan foydalaning, ikkinchi darajali bilan qo'llab-quvvatlang va tejamkorlik bilan urg'u bering.

Kontrast

O'qish va qulaylik uchun etarli kontrastni ta'minlang.

Uyg'unlik

Yagona vizual tajriba yaratish uchun ranglar birgalikda ishlashi kerak.

Rang kontrasti tekshiruvi

Matnni o'qish uchun WCAG mavjudlik standartlariga javob berish uchun rang kombinatsiyalarini sinab ko'ring.

Matn rangi
Fon rangi
Kontrast
Fail
Kichik matn
✖︎
Katta matn
✖︎
WCAG standartlari
AA:Oddiy matn uchun minimal kontrast nisbati 4,5:1 va katta matn uchun 3:1. Ko'pgina veb-saytlar uchun talab qilinadi.
AAA:Kengaytirilgan kontrast nisbati oddiy matn uchun 7:1 va katta matn uchun 4,5:1. Optimal qulaylik uchun tavsiya etiladi.

Hamma daho. Ammo agar siz baliqni daraxtga chiqish qobiliyatiga qarab baholasangiz, u butun umrini ahmoqligiga ishonib yashaydi.

- Albert Einstein

Texnik formatlar

Amaliy formatlar

Rang tahlili

Ko'rlik simulyatori

Ijodiy jihatlar