Реєстрація Реєстрація
ROBOT DISTOPIA

ROBOT DISTOPIA

Палітра з 10 кольорів · Нейтральні · Змішані · Комплементарна гармонія

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

ROBOT DISTOPIA

Палітра з 10 кольорів · Нейтральні кольори · Змішані тони · Комплементарна гармонія

Редагувати
Яскраві 10 кольорів Нейтральні Змішані Комплементарна tech dark red blue
Вподобання 25
Кольори 10

CSS-змінні

:root {
  --c-vibrant-1: #050513;
  --c-vibrant-2: #20154B;
  --c-vibrant-3: #5D0A3F;
  --c-vibrant-4: #AA134C;
  --c-vibrant-5: #6590FF;
  --c-vibrant-6: #ADDCFF;
  --c-vibrant-7: #7F4B15;
  --c-vibrant-8: #BC7F3B;
  --c-vibrant-9: #4B6F5B;
  --c-vibrant-10: #5B7A5B;
}

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

Ця яскрава палітра з 10 кольорів охоплює діапазон від Droplet (#ADDCFF), найсвітлішого тону, до Obsidian Shard (#050513), найтемнішого. Вона об'єднує Obsidian Shard, Tetsu-Kon Blue, Mulberry Wood, Cerise, Deep Denim, Droplet, Medium Brown, Cut the Mustard, Kale Green та Green Mantle в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 45. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 9 з них, найконтрастніша — #050513 на #ADDCFF (13,93:1).

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

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

Obsidian Shard #050513
RGB
rgb(5, 5, 19)
HSL
hsl(240, 58%, 5%)
Яскравість
0,002
Tetsu-Kon Blue #20154B
RGB
rgb(32, 21, 75)
HSL
hsl(252, 56%, 19%)
Яскравість
0,014
Mulberry Wood #5D0A3F
RGB
rgb(93, 10, 63)
HSL
hsl(322, 81%, 20%)
Яскравість
0,029
Cerise #AA134C
RGB
rgb(170, 19, 76)
HSL
hsl(337, 80%, 37%)
Яскравість
0,095
Deep Denim #6590FF
RGB
rgb(101, 144, 255)
HSL
hsl(223, 100%, 70%)
Яскравість
0,299
Droplet #ADDCFF
RGB
rgb(173, 220, 255)
HSL
hsl(206, 100%, 84%)
Яскравість
0,673
Medium Brown #7F4B15
RGB
rgb(127, 75, 21)
HSL
hsl(31, 72%, 29%)
Яскравість
0,096
Cut the Mustard #BC7F3B
RGB
rgb(188, 127, 59)
HSL
hsl(32, 52%, 48%)
Яскравість
0,262
Kale Green #4B6F5B
RGB
rgb(75, 111, 91)
HSL
hsl(147, 19%, 36%)
Яскравість
0,136
Green Mantle #5B7A5B
RGB
rgb(91, 122, 91)
HSL
hsl(120, 15%, 42%)
Яскравість
0,169

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

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

Aa #050513 на #ADDCFF 13,93:1 AAA
Aa #20154B на #ADDCFF 11,38:1 AAA
Aa #5D0A3F на #ADDCFF 9,15:1 AAA
Aa #050513 на #6590FF 6,73:1 AA
Aa #050513 на #BC7F3B 6,01:1 AA
Aa #20154B на #6590FF 5,50:1 AA
Aa #AA134C на #ADDCFF 4,97:1 AA
Aa #ADDCFF на #7F4B15 4,95:1 AA
Aa #20154B на #BC7F3B 4,91:1 AA
Aa #5D0A3F на #6590FF 4,42:1 AA, великий текст
Aa #050513 на #5B7A5B 4,22:1 AA, великий текст
Aa #5D0A3F на #BC7F3B 3,95:1 AA, великий текст
Aa #ADDCFF на #4B6F5B 3,88:1 AA, великий текст
Aa #050513 на #4B6F5B 3,59:1 AA, великий текст
Aa #20154B на #5B7A5B 3,45:1 AA, великий текст
Aa #ADDCFF на #5B7A5B 3,30:1 AA, великий текст
Aa #20154B на #4B6F5B 2,93:1 Не проходить
Aa #050513 на #7F4B15 2,81:1 Не проходить
Aa #050513 на #AA134C 2,80:1 Не проходить
Aa #5D0A3F на #5B7A5B 2,77:1 Не проходить
Aa #AA134C на #6590FF 2,40:1 Не проходить
Aa #6590FF на #7F4B15 2,39:1 Не проходить
Aa #5D0A3F на #4B6F5B 2,36:1 Не проходить
Aa #ADDCFF на #BC7F3B 2,32:1 Не проходить
Aa #20154B на #7F4B15 2,30:1 Не проходить
Aa #20154B на #AA134C 2,29:1 Не проходить
Aa #AA134C на #BC7F3B 2,15:1 Не проходить
Aa #7F4B15 на #BC7F3B 2,14:1 Не проходить
Aa #6590FF на #ADDCFF 2,07:1 Не проходить
Aa #6590FF на #4B6F5B 1,88:1 Не проходить
Aa #5D0A3F на #7F4B15 1,85:1 Не проходить
Aa #5D0A3F на #AA134C 1,84:1 Не проходить
Aa #BC7F3B на #4B6F5B 1,67:1 Не проходить
Aa #6590FF на #5B7A5B 1,60:1 Не проходить
Aa #050513 на #5D0A3F 1,52:1 Не проходить
Aa #AA134C на #5B7A5B 1,51:1 Не проходить
Aa #7F4B15 на #5B7A5B 1,50:1 Не проходить
Aa #BC7F3B на #5B7A5B 1,42:1 Не проходить
Aa #AA134C на #4B6F5B 1,28:1 Не проходить
Aa #7F4B15 на #4B6F5B 1,28:1 Не проходить
Aa #20154B на #5D0A3F 1,24:1 Не проходить
Aa #050513 на #20154B 1,22:1 Не проходить
Aa #4B6F5B на #5B7A5B 1,18:1 Не проходить
Aa #6590FF на #BC7F3B 1,12:1 Не проходить
Aa #AA134C на #7F4B15 1,00:1 Не проходить

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

#EDF1D6 #9DC08B #609966 #40513B
4 кольори
#F5F7F8 #F4CE14 #495E57 #45474B
4 кольори
#222831 #393E46 #FFD369 #EEEEEE
4 кольори
#000000 #52057B #892CDC #BC6FF1
4 кольори
#213555 #3E5879 #D8C4B6 #F5EFE7
4 кольори
#F5EFE7 #D8C4B6 #4F709C #213555
4 кольори
#191A19 #1E5128 #4E9F3D #D8E9A8
4 кольори
#352F44 #5C5470 #B9B4C7 #FAF0E6
4 кольори