Реєстрація Реєстрація
HK Pillbug Beach Party

HK Pillbug Beach Party

Палітра з 10 кольорів · Холодні · Змішані · Аналогова гармонія

До бібліотеки

HK Pillbug Beach Party

Палітра з 10 кольорів · Холодні кольори · Змішані тони · Аналогова гармонія

Редагувати
Приглушені 10 кольорів Холодні Змішані Аналогова gray blue cool cold
Вподобання 43
Кольори 10

CSS-змінні

:root {
  --c-muted-1: #050C36;
  --c-muted-2: #202D53;
  --c-muted-3: #41567E;
  --c-muted-4: #5A617C;
  --c-muted-5: #7A98B2;
  --c-muted-6: #98B3B9;
  --c-muted-7: #AD9FAC;
  --c-muted-8: #878DA5;
  --c-muted-9: #4F556A;
  --c-muted-10: #282B37;
}

Про цю палітру

Ця приглушена палітра з 10 кольорів охоплює діапазон від Mohair Soft Blue Grey (#98B3B9), найсвітлішого тону, до Infinite Night (#050C36), найтемнішого. Вона об'єднує Infinite Night, Pico Void, Sailor, Strong Iris, Dyer’s Woad, Mohair Soft Blue Grey, Symbolic, Violet Verbena, Heavy Violet та Mangu Black в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 45. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 9 з них, найконтрастніша — #050C36 на #98B3B9 (8,53:1).

Універсальна палітра для маркетингових сторінок, hero-блоків продукту, ілюстрацій і акцентних станів інтерфейсу.

Розбір кольорів

Infinite Night #050C36
RGB
rgb(5, 12, 54)
HSL
hsl(231, 83%, 12%)
Яскравість
0,006
Pico Void #202D53
RGB
rgb(32, 45, 83)
HSL
hsl(225, 44%, 23%)
Яскравість
0,028
Sailor #41567E
RGB
rgb(65, 86, 126)
HSL
hsl(219, 32%, 37%)
Яскравість
0,093
Strong Iris #5A617C
RGB
rgb(90, 97, 124)
HSL
hsl(228, 16%, 42%)
Яскравість
0,122
Dyer’s Woad #7A98B2
RGB
rgb(122, 152, 178)
HSL
hsl(208, 27%, 59%)
Яскравість
0,298
Mohair Soft Blue Grey #98B3B9
RGB
rgb(152, 179, 185)
HSL
hsl(191, 19%, 66%)
Яскравість
0,424
Symbolic #AD9FAC
RGB
rgb(173, 159, 172)
HSL
hsl(304, 8%, 65%)
Яскравість
0,367
Violet Verbena #878DA5
RGB
rgb(135, 141, 165)
HSL
hsl(228, 14%, 59%)
Яскравість
0,269
Heavy Violet #4F556A
RGB
rgb(79, 85, 106)
HSL
hsl(227, 15%, 36%)
Яскравість
0,092
Mangu Black #282B37
RGB
rgb(40, 43, 55)
HSL
hsl(228, 16%, 19%)
Яскравість
0,025

Контраст і доступність

Пар кольорів у палітрі: 45. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 9 з них.

Aa #050C36 на #98B3B9 8,53:1 AAA
Aa #050C36 на #AD9FAC 7,49:1 AAA
Aa #98B3B9 на #282B37 6,36:1 AA
Aa #050C36 на #7A98B2 6,26:1 AA
Aa #202D53 на #98B3B9 6,07:1 AA
Aa #050C36 на #878DA5 5,74:1 AA
Aa #AD9FAC на #282B37 5,59:1 AA
Aa #202D53 на #AD9FAC 5,34:1 AA
Aa #7A98B2 на #282B37 4,67:1 AA
Aa #202D53 на #7A98B2 4,46:1 AA, великий текст
Aa #878DA5 на #282B37 4,28:1 AA, великий текст
Aa #202D53 на #878DA5 4,09:1 AA, великий текст
Aa #98B3B9 на #4F556A 3,34:1 AA, великий текст
Aa #41567E на #98B3B9 3,32:1 AA, великий текст
Aa #050C36 на #5A617C 3,09:1 AA, великий текст
Aa #AD9FAC на #4F556A 2,93:1 Не проходить
Aa #41567E на #AD9FAC 2,92:1 Не проходить
Aa #5A617C на #98B3B9 2,76:1 Не проходить
Aa #050C36 на #41567E 2,57:1 Не проходить
Aa #050C36 на #4F556A 2,55:1 Не проходить
Aa #7A98B2 на #4F556A 2,45:1 Не проходить
Aa #41567E на #7A98B2 2,44:1 Не проходить
Aa #5A617C на #AD9FAC 2,43:1 Не проходить
Aa #5A617C на #282B37 2,30:1 Не проходить
Aa #878DA5 на #4F556A 2,25:1 Не проходить
Aa #41567E на #878DA5 2,23:1 Не проходить
Aa #202D53 на #5A617C 2,20:1 Не проходить
Aa #5A617C на #7A98B2 2,03:1 Не проходить
Aa #41567E на #282B37 1,92:1 Не проходить
Aa #4F556A на #282B37 1,90:1 Не проходить
Aa #5A617C на #878DA5 1,86:1 Не проходить
Aa #202D53 на #41567E 1,83:1 Не проходить
Aa #202D53 на #4F556A 1,82:1 Не проходить
Aa #98B3B9 на #878DA5 1,49:1 Не проходить
Aa #050C36 на #202D53 1,40:1 Не проходить
Aa #7A98B2 на #98B3B9 1,36:1 Не проходить
Aa #050C36 на #282B37 1,34:1 Не проходить
Aa #AD9FAC на #878DA5 1,31:1 Не проходить
Aa #5A617C на #4F556A 1,21:1 Не проходить
Aa #41567E на #5A617C 1,20:1 Не проходить
Aa #7A98B2 на #AD9FAC 1,20:1 Не проходить
Aa #98B3B9 на #AD9FAC 1,14:1 Не проходить
Aa #7A98B2 на #878DA5 1,09:1 Не проходить
Aa #202D53 на #282B37 1,05:1 Не проходить
Aa #41567E на #4F556A 1,01:1 Не проходить

Схожі палітри

#222831 #393E46 #00ADB5 #EEEEEE
4 кольори
#F9F7F7 #DBE2EF #3F72AF #112D4E
4 кольори
#1B262C #0F4C75 #3282B8 #BBE1FA
4 кольори
#08D9D6 #252A34 #FF2E63 #EAEAEA
4 кольори
#27374D #526D82 #9DB2BF #DDE6ED
4 кольори
#364F6B #3FC1C9 #F5F5F5 #FC5185
4 кольори
#E4F9F5 #30E3CA #11999E #40514E
4 кольори
#F0F5F9 #C9D6DF #52616B #1E2022
4 кольори