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

Hetzelfde

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

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

Hetzelfde

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

Редагувати
Приглушені 12 кольорів Холодні Темні Монохромна gray black white red
Вподобання 31
Кольори 12

CSS-змінні

:root {
  --c-muted-1: #3E3F4A;
  --c-muted-2: #5D606B;
  --c-muted-3: #6F687C;
  --c-muted-4: #91929B;
  --c-muted-5: #1D1E26;
  --c-muted-6: #2E2A34;
  --c-muted-7: #293455;
  --c-muted-8: #4C5F81;
  --c-muted-9: #B4D8F7;
  --c-muted-10: #FFFFFF;
  --c-muted-11: #6E053D;
  --c-muted-12: #FF0100;
}

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

Ця приглушена палітра з 12 кольорів охоплює діапазон від White (#FFFFFF), найсвітлішого тону, до Noble Black (#1D1E26), найтемнішого. Вона об'єднує Indian Ink, Concrete Landscape, Victorian Iris, Lilac Fields, Noble Black, Haiti, Midnight Escapade, Bijou Blue, Blue Rice, White, Spanish Purple та Red в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 15 з них, найконтрастніша — #1D1E26 на #FFFFFF (16,59:1).

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

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

Indian Ink #3E3F4A
RGB
rgb(62, 63, 74)
HSL
hsl(235, 9%, 27%)
Яскравість
0,051
Concrete Landscape #5D606B
RGB
rgb(93, 96, 107)
HSL
hsl(227, 7%, 39%)
Яскравість
0,118
Victorian Iris #6F687C
RGB
rgb(111, 104, 124)
HSL
hsl(261, 9%, 45%)
Яскравість
0,147
Lilac Fields #91929B
RGB
rgb(145, 146, 155)
HSL
hsl(234, 5%, 59%)
Яскравість
0,289
Noble Black #1D1E26
RGB
rgb(29, 30, 38)
HSL
hsl(233, 13%, 13%)
Яскравість
0,013
Haiti #2E2A34
RGB
rgb(46, 42, 52)
HSL
hsl(264, 11%, 18%)
Яскравість
0,025
Midnight Escapade #293455
RGB
rgb(41, 52, 85)
HSL
hsl(225, 35%, 25%)
Яскравість
0,036
Bijou Blue #4C5F81
RGB
rgb(76, 95, 129)
HSL
hsl(218, 26%, 40%)
Яскравість
0,113
Blue Rice #B4D8F7
RGB
rgb(180, 216, 247)
HSL
hsl(208, 81%, 84%)
Яскравість
0,655
White #FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
Яскравість
1,000
Spanish Purple #6E053D
RGB
rgb(110, 5, 61)
HSL
hsl(328, 91%, 23%)
Яскравість
0,038
Red #FF0100
RGB
rgb(255, 1, 0)
HSL
hsl(0, 100%, 50%)
Яскравість
0,213

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

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

Aa #1D1E26 на #FFFFFF 16,59:1 AAA
Aa #2E2A34 на #FFFFFF 14,03:1 AAA
Aa #293455 на #FFFFFF 12,23:1 AAA
Aa #FFFFFF на #6E053D 11,99:1 AAA
Aa #1D1E26 на #B4D8F7 11,14:1 AAA
Aa #3E3F4A на #FFFFFF 10,42:1 AAA
Aa #2E2A34 на #B4D8F7 9,42:1 AAA
Aa #293455 на #B4D8F7 8,22:1 AAA
Aa #B4D8F7 на #6E053D 8,05:1 AAA
Aa #3E3F4A на #B4D8F7 7,00:1 AAA
Aa #4C5F81 на #FFFFFF 6,44:1 AA
Aa #5D606B на #FFFFFF 6,27:1 AA
Aa #91929B на #1D1E26 5,36:1 AA
Aa #6F687C на #FFFFFF 5,32:1 AA
Aa #91929B на #2E2A34 4,54:1 AA
Aa #4C5F81 на #B4D8F7 4,33:1 AA, великий текст
Aa #5D606B на #B4D8F7 4,21:1 AA, великий текст
Aa #1D1E26 на #FF0100 4,15:1 AA, великий текст
Aa #FFFFFF на #FF0100 4,00:1 AA, великий текст
Aa #91929B на #293455 3,95:1 AA, великий текст
Aa #91929B на #6E053D 3,87:1 AA, великий текст
Aa #6F687C на #B4D8F7 3,57:1 AA, великий текст
Aa #2E2A34 на #FF0100 3,51:1 AA, великий текст
Aa #3E3F4A на #91929B 3,37:1 AA, великий текст
Aa #6F687C на #1D1E26 3,12:1 AA, великий текст
Aa #91929B на #FFFFFF 3,09:1 AA, великий текст
Aa #293455 на #FF0100 3,06:1 AA, великий текст
Aa #6E053D на #FF0100 3,00:1 AA, великий текст
Aa #B4D8F7 на #FF0100 2,68:1 Не проходить
Aa #5D606B на #1D1E26 2,65:1 Не проходить
Aa #6F687C на #2E2A34 2,64:1 Не проходить
Aa #3E3F4A на #FF0100 2,61:1 Не проходить
Aa #1D1E26 на #4C5F81 2,58:1 Не проходить
Aa #6F687C на #293455 2,30:1 Не проходить
Aa #6F687C на #6E053D 2,25:1 Не проходить
Aa #5D606B на #2E2A34 2,24:1 Не проходить
Aa #2E2A34 на #4C5F81 2,18:1 Не проходить
Aa #91929B на #4C5F81 2,08:1 Не проходить
Aa #91929B на #B4D8F7 2,08:1 Не проходить
Aa #5D606B на #91929B 2,03:1 Не проходить
Aa #3E3F4A на #6F687C 1,96:1 Не проходить
Aa #5D606B на #293455 1,95:1 Не проходить
Aa #5D606B на #6E053D 1,91:1 Не проходить
Aa #293455 на #4C5F81 1,90:1 Не проходить
Aa #4C5F81 на #6E053D 1,86:1 Не проходить
Aa #6F687C на #91929B 1,72:1 Не проходить
Aa #3E3F4A на #5D606B 1,66:1 Не проходить
Aa #3E3F4A на #4C5F81 1,62:1 Не проходить
Aa #4C5F81 на #FF0100 1,61:1 Не проходить
Aa #3E3F4A на #1D1E26 1,59:1 Не проходить
Aa #5D606B на #FF0100 1,57:1 Не проходить
Aa #B4D8F7 на #FFFFFF 1,49:1 Не проходить
Aa #1D1E26 на #6E053D 1,38:1 Не проходить
Aa #1D1E26 на #293455 1,36:1 Не проходить
Aa #3E3F4A на #2E2A34 1,35:1 Не проходить
Aa #6F687C на #FF0100 1,33:1 Не проходить
Aa #91929B на #FF0100 1,29:1 Не проходить
Aa #6F687C на #4C5F81 1,21:1 Не проходить
Aa #5D606B на #6F687C 1,18:1 Не проходить
Aa #1D1E26 на #2E2A34 1,18:1 Не проходить
Aa #3E3F4A на #293455 1,17:1 Не проходить
Aa #2E2A34 на #6E053D 1,17:1 Не проходить
Aa #3E3F4A на #6E053D 1,15:1 Не проходить
Aa #2E2A34 на #293455 1,15:1 Не проходить
Aa #5D606B на #4C5F81 1,03:1 Не проходить
Aa #293455 на #6E053D 1,02: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 кольори