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

TriRampo

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

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

TriRampo

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

Редагувати
Яскраві 12 кольорів Теплі Змішані Комплементарна colorful anubiarts 12 trirampo
Вподобання 105
Кольори 12

CSS-змінні

:root {
  --c-vibrant-1: #703075;
  --c-vibrant-2: #CC3184;
  --c-vibrant-3: #E87D43;
  --c-vibrant-4: #FFCE6B;
  --c-vibrant-5: #DAF0D1;
  --c-vibrant-6: #5DD477;
  --c-vibrant-7: #25A2A8;
  --c-vibrant-8: #4B56EB;
  --c-vibrant-9: #2F328F;
  --c-vibrant-10: #2C203D;
  --c-vibrant-11: #7A8799;
  --c-vibrant-12: #AEC2C2;
}

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

Ця яскрава палітра з 12 кольорів охоплює діапазон від Blue Romance (#DAF0D1), найсвітлішого тону, до Throat (#2C203D), найтемнішого. Вона об'єднує Galactic Grapevine, Shrine of Pleasures, Solar Flare, Faded Sunlight, Blue Romance, Spring Bouquet, Cancer Seagreen Scarab, Qing Dynasty Dragon, Ultramarine Highlight, Throat, Spartan Blue та Dover Surf в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 15 з них, найконтрастніша — #DAF0D1 на #2C203D (12,57:1).

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

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

Galactic Grapevine #703075
RGB
rgb(112, 48, 117)
HSL
hsl(296, 42%, 32%)
Яскравість
0,068
Shrine of Pleasures #CC3184
RGB
rgb(204, 49, 132)
HSL
hsl(328, 61%, 50%)
Яскравість
0,167
Solar Flare #E87D43
RGB
rgb(232, 125, 67)
HSL
hsl(21, 78%, 59%)
Яскравість
0,322
Faded Sunlight #FFCE6B
RGB
rgb(255, 206, 107)
HSL
hsl(40, 100%, 71%)
Яскравість
0,665
Blue Romance #DAF0D1
RGB
rgb(218, 240, 209)
HSL
hsl(103, 51%, 88%)
Яскравість
0,818
Spring Bouquet #5DD477
RGB
rgb(93, 212, 119)
HSL
hsl(133, 58%, 60%)
Яскравість
0,508
Cancer Seagreen Scarab #25A2A8
RGB
rgb(37, 162, 168)
HSL
hsl(183, 64%, 40%)
Яскравість
0,291
Qing Dynasty Dragon #4B56EB
RGB
rgb(75, 86, 235)
HSL
hsl(236, 80%, 61%)
Яскравість
0,142
Ultramarine Highlight #2F328F
RGB
rgb(47, 50, 143)
HSL
hsl(238, 51%, 37%)
Яскравість
0,049
Throat #2C203D
RGB
rgb(44, 32, 61)
HSL
hsl(265, 31%, 18%)
Яскравість
0,019
Spartan Blue #7A8799
RGB
rgb(122, 135, 153)
HSL
hsl(215, 13%, 54%)
Яскравість
0,238
Dover Surf #AEC2C2
RGB
rgb(174, 194, 194)
HSL
hsl(180, 14%, 72%)
Яскравість
0,515

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

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

Aa #DAF0D1 на #2C203D 12,57:1 AAA
Aa #FFCE6B на #2C203D 10,35:1 AAA
Aa #DAF0D1 на #2F328F 8,80:1 AAA
Aa #2C203D на #AEC2C2 8,18:1 AAA
Aa #5DD477 на #2C203D 8,07:1 AAA
Aa #703075 на #DAF0D1 7,33:1 AAA
Aa #FFCE6B на #2F328F 7,24:1 AAA
Aa #703075 на #FFCE6B 6,03:1 AA
Aa #2F328F на #AEC2C2 5,72:1 AA
Aa #5DD477 на #2F328F 5,65:1 AA
Aa #E87D43 на #2C203D 5,39:1 AA
Aa #25A2A8 на #2C203D 4,93:1 AA
Aa #703075 на #AEC2C2 4,77:1 AA
Aa #703075 на #5DD477 4,71:1 AA
Aa #DAF0D1 на #4B56EB 4,53:1 AA
Aa #2C203D на #7A8799 4,17:1 AA, великий текст
Aa #CC3184 на #DAF0D1 4,00:1 AA, великий текст
Aa #E87D43 на #2F328F 3,77:1 AA, великий текст
Aa #FFCE6B на #4B56EB 3,73:1 AA, великий текст
Aa #25A2A8 на #2F328F 3,45:1 AA, великий текст
Aa #CC3184 на #FFCE6B 3,29:1 AA, великий текст
Aa #703075 на #E87D43 3,14:1 AA, великий текст
Aa #CC3184 на #2C203D 3,14:1 AA, великий текст
Aa #DAF0D1 на #7A8799 3,02:1 AA, великий текст
Aa #4B56EB на #AEC2C2 2,95:1 Не проходить
Aa #5DD477 на #4B56EB 2,91:1 Не проходить
Aa #2F328F на #7A8799 2,91:1 Не проходить
Aa #703075 на #25A2A8 2,88:1 Не проходить
Aa #4B56EB на #2C203D 2,77:1 Не проходить
Aa #CC3184 на #AEC2C2 2,60:1 Не проходить
Aa #CC3184 на #5DD477 2,57:1 Не проходить
Aa #DAF0D1 на #25A2A8 2,55:1 Не проходить
Aa #FFCE6B на #7A8799 2,48:1 Не проходить
Aa #703075 на #7A8799 2,43:1 Не проходить
Aa #E87D43 на #DAF0D1 2,33:1 Не проходить
Aa #CC3184 на #2F328F 2,20:1 Не проходить
Aa #FFCE6B на #25A2A8 2,10:1 Не проходить
Aa #7A8799 на #AEC2C2 1,96:1 Не проходить
Aa #E87D43 на #4B56EB 1,94:1 Не проходить
Aa #5DD477 на #7A8799 1,94:1 Не проходить
Aa #4B56EB на #2F328F 1,94:1 Не проходить
Aa #E87D43 на #FFCE6B 1,92:1 Не проходить
Aa #703075 на #CC3184 1,83:1 Не проходить
Aa #25A2A8 на #4B56EB 1,78:1 Не проходить
Aa #703075 на #2C203D 1,72:1 Не проходить
Aa #CC3184 на #E87D43 1,72:1 Не проходить
Aa #25A2A8 на #AEC2C2 1,66:1 Не проходить
Aa #5DD477 на #25A2A8 1,64:1 Не проходить
Aa #703075 на #4B56EB 1,62:1 Не проходить
Aa #CC3184 на #25A2A8 1,57:1 Не проходить
Aa #DAF0D1 на #5DD477 1,56:1 Не проходить
Aa #DAF0D1 на #AEC2C2 1,54:1 Не проходить
Aa #E87D43 на #AEC2C2 1,52:1 Не проходить
Aa #E87D43 на #5DD477 1,50:1 Не проходить
Aa #4B56EB на #7A8799 1,50:1 Не проходить
Aa #2F328F на #2C203D 1,43:1 Не проходить
Aa #CC3184 на #7A8799 1,33:1 Не проходить
Aa #E87D43 на #7A8799 1,29:1 Не проходить
Aa #FFCE6B на #5DD477 1,28:1 Не проходить
Aa #FFCE6B на #AEC2C2 1,27:1 Не проходить
Aa #FFCE6B на #DAF0D1 1,22:1 Не проходить
Aa #703075 на #2F328F 1,20:1 Не проходить
Aa #25A2A8 на #7A8799 1,18:1 Не проходить
Aa #CC3184 на #4B56EB 1,13:1 Не проходить
Aa #E87D43 на #25A2A8 1,09:1 Не проходить
Aa #5DD477 на #AEC2C2 1,01:1 Не проходить

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

#F9ED69 #F08A5D #B83B5E #6A2C70
4 кольори
#7D5A50 #B4846C #E5B299 #FCDEC0
4 кольори
#FFF8EA #9E7676 #815B5B #594545
4 кольори
#2C3639 #3F4E4F #A27B5C #DCD7C9
4 кольори
#F67280 #C06C84 #6C5B7B #355C7D
4 кольори
#2B2E4A #E84545 #903749 #53354A
4 кольори
#E5D9B6 #A4BE7B #5F8D4E #285430
4 кольори
#A9907E #F3DEBA #ABC4AA #675D50
4 кольори