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

Latesummer

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

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

Latesummer

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

Редагувати
Яскраві 9 кольорів Нейтральні Змішані Комплементарна
Вподобання 5
Кольори 9

CSS-змінні

:root {
  --c-vibrant-1: #254E70;
  --c-vibrant-2: #37718E;
  --c-vibrant-3: #8EE3EF;
  --c-vibrant-4: #A30000;
  --c-vibrant-5: #FF7700;
  --c-vibrant-6: #E8C547;
  --c-vibrant-7: #118A45;
  --c-vibrant-8: #60B426;
  --c-vibrant-9: #BED558;
}

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

Ця яскрава палітра з 9 кольорів охоплює діапазон від Photon Barrier (#8EE3EF), найсвітлішого тону, до Blue Tang (#254E70), найтемнішого. Вона об'єднує Blue Tang, Living Stream, Photon Barrier, Stanger Red, Lucky Orange, Liberator Gold, The Wild Apothecary, Chasm Green та Frog Prince в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 36. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 6 з них, найконтрастніша — #254E70 на #8EE3EF (5,99:1).

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

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

Blue Tang #254E70
RGB
rgb(37, 78, 112)
HSL
hsl(207, 50%, 29%)
Яскравість
0,070
Living Stream #37718E
RGB
rgb(55, 113, 142)
HSL
hsl(200, 44%, 39%)
Яскравість
0,146
Photon Barrier #8EE3EF
RGB
rgb(142, 227, 239)
HSL
hsl(187, 75%, 75%)
Яскравість
0,669
Stanger Red #A30000
RGB
rgb(163, 0, 0)
HSL
hsl(0, 100%, 32%)
Яскравість
0,078
Lucky Orange #FF7700
RGB
rgb(255, 119, 0)
HSL
hsl(28, 100%, 50%)
Яскравість
0,345
Liberator Gold #E8C547
RGB
rgb(232, 197, 71)
HSL
hsl(47, 78%, 59%)
Яскравість
0,575
The Wild Apothecary #118A45
RGB
rgb(17, 138, 69)
HSL
hsl(146, 78%, 30%)
Яскравість
0,187
Chasm Green #60B426
RGB
rgb(96, 180, 38)
HSL
hsl(95, 65%, 43%)
Яскравість
0,353
Frog Prince #BED558
RGB
rgb(190, 213, 88)
HSL
hsl(71, 60%, 59%)
Яскравість
0,592

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

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

Aa #254E70 на #8EE3EF 5,99:1 AA
Aa #8EE3EF на #A30000 5,62:1 AA
Aa #254E70 на #BED558 5,35:1 AA
Aa #254E70 на #E8C547 5,21:1 AA
Aa #A30000 на #BED558 5,02:1 AA
Aa #A30000 на #E8C547 4,89:1 AA
Aa #37718E на #8EE3EF 3,67:1 AA, великий текст
Aa #254E70 на #60B426 3,35:1 AA, великий текст
Aa #254E70 на #FF7700 3,28:1 AA, великий текст
Aa #37718E на #BED558 3,28:1 AA, великий текст
Aa #37718E на #E8C547 3,19:1 AA, великий текст
Aa #A30000 на #60B426 3,15:1 AA, великий текст
Aa #A30000 на #FF7700 3,09:1 AA, великий текст
Aa #8EE3EF на #118A45 3,03:1 AA, великий текст
Aa #118A45 на #BED558 2,71:1 Не проходить
Aa #E8C547 на #118A45 2,64:1 Не проходить
Aa #37718E на #60B426 2,06:1 Не проходить
Aa #37718E на #FF7700 2,02:1 Не проходить
Aa #254E70 на #118A45 1,98:1 Не проходить
Aa #A30000 на #118A45 1,86:1 Не проходить
Aa #8EE3EF на #FF7700 1,82:1 Не проходить
Aa #8EE3EF на #60B426 1,79:1 Не проходить
Aa #118A45 на #60B426 1,70:1 Не проходить
Aa #FF7700 на #118A45 1,66:1 Не проходить
Aa #254E70 на #37718E 1,63:1 Не проходить
Aa #FF7700 на #BED558 1,63:1 Не проходить
Aa #60B426 на #BED558 1,60:1 Не проходить
Aa #FF7700 на #E8C547 1,59:1 Не проходить
Aa #E8C547 на #60B426 1,55:1 Не проходить
Aa #37718E на #A30000 1,53:1 Не проходить
Aa #37718E на #118A45 1,21:1 Не проходить
Aa #8EE3EF на #E8C547 1,15:1 Не проходить
Aa #8EE3EF на #BED558 1,12:1 Не проходить
Aa #254E70 на #A30000 1,06:1 Не проходить
Aa #E8C547 на #BED558 1,03:1 Не проходить
Aa #FF7700 на #60B426 1,02: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 кольори