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

H2O

Палітра з 10 кольорів · Холодні · Темні · Тріадна гармонія

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

H2O

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

Редагувати
Приглушені 10 кольорів Холодні Темні Тріадна green blue lagoon
Вподобання 18
Кольори 10

CSS-змінні

:root {
  --c-muted-1: #090909;
  --c-muted-2: #18173C;
  --c-muted-3: #293329;
  --c-muted-4: #244457;
  --c-muted-5: #315C3D;
  --c-muted-6: #3B8271;
  --c-muted-7: #519A59;
  --c-muted-8: #92B0A8;
  --c-muted-9: #82CC92;
  --c-muted-10: #EFD7E6;
}

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

Ця приглушена палітра з 10 кольорів охоплює діапазон від All Made Up (#EFD7E6), найсвітлішого тону, до Badab Black Wash (#090909), найтемнішого. Вона об'єднує Badab Black Wash, Nightwalker, Gordons Green, Astronaut Blue, Verde Garrafa, Copper Mineral Green, Clover Patch, Delicate Green, Good Luck Charm та All Made Up в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 45. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 14 з них, найконтрастніша — #090909 на #EFD7E6 (14,73:1).

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

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

Badab Black Wash #090909
RGB
rgb(9, 9, 9)
HSL
hsl(0, 0%, 4%)
Яскравість
0,003
Nightwalker #18173C
RGB
rgb(24, 23, 60)
HSL
hsl(242, 45%, 16%)
Яскравість
0,011
Gordons Green #293329
RGB
rgb(41, 51, 41)
HSL
hsl(120, 11%, 18%)
Яскравість
0,030
Astronaut Blue #244457
RGB
rgb(36, 68, 87)
HSL
hsl(202, 41%, 24%)
Яскравість
0,052
Verde Garrafa #315C3D
RGB
rgb(49, 92, 61)
HSL
hsl(137, 30%, 28%)
Яскравість
0,086
Copper Mineral Green #3B8271
RGB
rgb(59, 130, 113)
HSL
hsl(166, 38%, 37%)
Яскравість
0,181
Clover Patch #519A59
RGB
rgb(81, 154, 89)
HSL
hsl(127, 31%, 46%)
Яскравість
0,256
Delicate Green #92B0A8
RGB
rgb(146, 176, 168)
HSL
hsl(164, 16%, 63%)
Яскравість
0,400
Good Luck Charm #82CC92
RGB
rgb(130, 204, 146)
HSL
hsl(133, 42%, 65%)
Яскравість
0,500
All Made Up #EFD7E6
RGB
rgb(239, 215, 230)
HSL
hsl(323, 43%, 89%)
Яскравість
0,727

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

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

Aa #090909 на #EFD7E6 14,73:1 AAA
Aa #18173C на #EFD7E6 12,66:1 AAA
Aa #090909 на #82CC92 10,43:1 AAA
Aa #293329 на #EFD7E6 9,71:1 AAA
Aa #18173C на #82CC92 8,97:1 AAA
Aa #090909 на #92B0A8 8,53:1 AAA
Aa #244457 на #EFD7E6 7,62:1 AAA
Aa #18173C на #92B0A8 7,34:1 AAA
Aa #293329 на #82CC92 6,88:1 AA
Aa #090909 на #519A59 5,80:1 AA
Aa #315C3D на #EFD7E6 5,69:1 AA
Aa #293329 на #92B0A8 5,62:1 AA
Aa #244457 на #82CC92 5,39:1 AA
Aa #18173C на #519A59 4,99:1 AA
Aa #244457 на #92B0A8 4,41:1 AA, великий текст
Aa #090909 на #3B8271 4,38:1 AA, великий текст
Aa #315C3D на #82CC92 4,03:1 AA, великий текст
Aa #293329 на #519A59 3,82:1 AA, великий текст
Aa #18173C на #3B8271 3,76:1 AA, великий текст
Aa #3B8271 на #EFD7E6 3,36:1 AA, великий текст
Aa #315C3D на #92B0A8 3,30:1 AA, великий текст
Aa #244457 на #519A59 3,00:1 AA, великий текст
Aa #293329 на #3B8271 2,89:1 Не проходить
Aa #090909 на #315C3D 2,59:1 Не проходить
Aa #519A59 на #EFD7E6 2,54:1 Не проходить
Aa #3B8271 на #82CC92 2,38:1 Не проходить
Aa #244457 на #3B8271 2,26:1 Не проходить
Aa #315C3D на #519A59 2,24:1 Не проходить
Aa #18173C на #315C3D 2,22:1 Не проходить
Aa #3B8271 на #92B0A8 1,95:1 Не проходить
Aa #090909 на #244457 1,93:1 Не проходить
Aa #519A59 на #82CC92 1,80:1 Не проходить
Aa #92B0A8 на #EFD7E6 1,73:1 Не проходить
Aa #293329 на #315C3D 1,71:1 Не проходить
Aa #315C3D на #3B8271 1,69:1 Не проходить
Aa #18173C на #244457 1,66:1 Не проходить
Aa #090909 на #293329 1,52:1 Не проходить
Aa #519A59 на #92B0A8 1,47:1 Не проходить
Aa #82CC92 на #EFD7E6 1,41:1 Не проходить
Aa #244457 на #315C3D 1,34:1 Не проходить
Aa #3B8271 на #519A59 1,32:1 Не проходить
Aa #18173C на #293329 1,30:1 Не проходить
Aa #293329 на #244457 1,27:1 Не проходить
Aa #92B0A8 на #82CC92 1,22:1 Не проходить
Aa #090909 на #18173C 1,16:1 Не проходить

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

#212121 #323232 #0D7377 #14FFEC
4 кольори
#0A2647 #144272 #205295 #2C74B3
4 кольори
#040D12 #183D3D #5C8374 #93B1A6
4 кольори
#142850 #27496D #0C7B93 #00A8CC
4 кольори
#635985 #443C68 #393053 #18122B
4 кольори
#000000 #150050 #3F0071 #610094
4 кольори
#151515 #301B3F #3C415C #B4A5A5
4 кольори
#041C32 #04293A #064663 #ECB365
4 кольори