Реєстрація Реєстрація
DeuteroSpill

DeuteroSpill

Палітра з 9 кольорів · Холодні · Змішані · Комплементарна гармонія

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

DeuteroSpill

Палітра з 9 кольорів · Холодні кольори · Змішані тони · Комплементарна гармонія

Редагувати
Приглушені 9 кольорів Холодні Змішані Комплементарна blue yellow water royalnaym
Вподобання 93
Кольори 9

CSS-змінні

:root {
  --c-muted-1: #153457;
  --c-muted-2: #183C5C;
  --c-muted-3: #1D4961;
  --c-muted-4: #45585D;
  --c-muted-5: #6D6E46;
  --c-muted-6: #7F8068;
  --c-muted-7: #96998E;
  --c-muted-8: #ACB2B1;
  --c-muted-9: #CBD5FC;
}

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

Ця приглушена палітра з 9 кольорів охоплює діапазон від Pale Phthalo Blue (#CBD5FC), найсвітлішого тону, до Incremental Blue (#153457), найтемнішого. Вона об'єднує Incremental Blue, Poseidon, Dark Slate Blue, Asher Benjamin, Jungle Trail, Ivy Garden, Hunter’s Hollow, Tin Foil та Pale Phthalo Blue в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 36. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 6 з них, найконтрастніша — #153457 на #CBD5FC (8,71:1).

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

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

Incremental Blue #153457
RGB
rgb(21, 52, 87)
HSL
hsl(212, 61%, 21%)
Яскравість
0,033
Poseidon #183C5C
RGB
rgb(24, 60, 92)
HSL
hsl(208, 59%, 23%)
Яскравість
0,042
Dark Slate Blue #1D4961
RGB
rgb(29, 73, 97)
HSL
hsl(201, 54%, 25%)
Яскравість
0,059
Asher Benjamin #45585D
RGB
rgb(69, 88, 93)
HSL
hsl(193, 15%, 32%)
Яскравість
0,090
Jungle Trail #6D6E46
RGB
rgb(109, 110, 70)
HSL
hsl(62, 22%, 35%)
Яскравість
0,149
Ivy Garden #7F8068
RGB
rgb(127, 128, 104)
HSL
hsl(63, 10%, 45%)
Яскравість
0,210
Hunter’s Hollow #96998E
RGB
rgb(150, 153, 142)
HSL
hsl(76, 5%, 58%)
Яскравість
0,312
Tin Foil #ACB2B1
RGB
rgb(172, 178, 177)
HSL
hsl(170, 4%, 69%)
Яскравість
0,438
Pale Phthalo Blue #CBD5FC
RGB
rgb(203, 213, 252)
HSL
hsl(228, 89%, 89%)
Яскравість
0,673

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

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

Aa #153457 на #CBD5FC 8,71:1 AAA
Aa #183C5C на #CBD5FC 7,86:1 AAA
Aa #1D4961 на #CBD5FC 6,64:1 AA
Aa #153457 на #ACB2B1 5,88:1 AA
Aa #183C5C на #ACB2B1 5,30:1 AA
Aa #45585D на #CBD5FC 5,15:1 AA
Aa #1D4961 на #ACB2B1 4,48:1 AA, великий текст
Aa #153457 на #96998E 4,36:1 AA, великий текст
Aa #183C5C на #96998E 3,94:1 AA, великий текст
Aa #6D6E46 на #CBD5FC 3,64:1 AA, великий текст
Aa #45585D на #ACB2B1 3,48:1 AA, великий текст
Aa #1D4961 на #96998E 3,33:1 AA, великий текст
Aa #153457 на #7F8068 3,13:1 AA, великий текст
Aa #183C5C на #7F8068 2,82:1 Не проходить
Aa #7F8068 на #CBD5FC 2,79:1 Не проходить
Aa #45585D на #96998E 2,58:1 Не проходить
Aa #6D6E46 на #ACB2B1 2,46:1 Не проходить
Aa #153457 на #6D6E46 2,39:1 Не проходить
Aa #1D4961 на #7F8068 2,38:1 Не проходить
Aa #183C5C на #6D6E46 2,16:1 Не проходить
Aa #96998E на #CBD5FC 2,00:1 Не проходить
Aa #7F8068 на #ACB2B1 1,88:1 Не проходить
Aa #45585D на #7F8068 1,85:1 Не проходить
Aa #6D6E46 на #96998E 1,83:1 Не проходить
Aa #1D4961 на #6D6E46 1,82:1 Не проходить
Aa #153457 на #45585D 1,69:1 Не проходить
Aa #183C5C на #45585D 1,53:1 Не проходить
Aa #ACB2B1 на #CBD5FC 1,48:1 Не проходить
Aa #45585D на #6D6E46 1,41:1 Не проходить
Aa #7F8068 на #96998E 1,40:1 Не проходить
Aa #96998E на #ACB2B1 1,35:1 Не проходить
Aa #153457 на #1D4961 1,31:1 Не проходить
Aa #6D6E46 на #7F8068 1,31:1 Не проходить
Aa #1D4961 на #45585D 1,29:1 Не проходить
Aa #183C5C на #1D4961 1,18:1 Не проходить
Aa #153457 на #183C5C 1,11: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 кольори