Реєстрація Реєстрація
Sunfall 12

Sunfall 12

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

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

Sunfall 12

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

Редагувати
Яскраві 12 кольорів Теплі Змішані Аналогова orange midnight pink purple
Вподобання 106
Кольори 12

CSS-змінні

:root {
  --c-vibrant-1: #1F0A1F;
  --c-vibrant-2: #4D1059;
  --c-vibrant-3: #6B155E;
  --c-vibrant-4: #8C2964;
  --c-vibrant-5: #A63169;
  --c-vibrant-6: #C23E6E;
  --c-vibrant-7: #D94E6A;
  --c-vibrant-8: #DE6B5B;
  --c-vibrant-9: #ED9A6D;
  --c-vibrant-10: #FFC37A;
  --c-vibrant-11: #FFEB99;
  --c-vibrant-12: #FEFFCF;
}

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

Ця яскрава палітра з 12 кольорів охоплює діапазон від Ice Yellow (#FEFFCF), найсвітлішого тону, до Meški Black (#1F0A1F), найтемнішого. Вона об'єднує Meški Black, Cosmic Explorer, Purple Curse, Beetiful Magenta, Valentine’s Day, Lilac Rose, Rosy Cheeks, Coralite, Florida Mango, Bronze Blush, Old Yella та Ice Yellow в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 20 з них, найконтрастніша — #1F0A1F на #FEFFCF (18,21:1).

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

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

Meški Black #1F0A1F
RGB
rgb(31, 10, 31)
HSL
hsl(300, 51%, 8%)
Яскравість
0,006
Cosmic Explorer #4D1059
RGB
rgb(77, 16, 89)
HSL
hsl(290, 70%, 21%)
Яскравість
0,027
Purple Curse #6B155E
RGB
rgb(107, 21, 94)
HSL
hsl(309, 67%, 25%)
Яскравість
0,045
Beetiful Magenta #8C2964
RGB
rgb(140, 41, 100)
HSL
hsl(324, 55%, 35%)
Яскравість
0,081
Valentine’s Day #A63169
RGB
rgb(166, 49, 105)
HSL
hsl(331, 54%, 42%)
Яскравість
0,113
Lilac Rose #C23E6E
RGB
rgb(194, 62, 110)
HSL
hsl(338, 52%, 50%)
Яскравість
0,160
Rosy Cheeks #D94E6A
RGB
rgb(217, 78, 106)
HSL
hsl(348, 65%, 58%)
Яскравість
0,212
Coralite #DE6B5B
RGB
rgb(222, 107, 91)
HSL
hsl(7, 66%, 61%)
Яскравість
0,268
Florida Mango #ED9A6D
RGB
rgb(237, 154, 109)
HSL
hsl(21, 78%, 68%)
Яскравість
0,422
Bronze Blush #FFC37A
RGB
rgb(255, 195, 122)
HSL
hsl(33, 100%, 74%)
Яскравість
0,617
Old Yella #FFEB99
RGB
rgb(255, 235, 153)
HSL
hsl(48, 100%, 80%)
Яскравість
0,830
Ice Yellow #FEFFCF
RGB
rgb(254, 255, 207)
HSL
hsl(61, 100%, 91%)
Яскравість
0,971

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

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

Aa #1F0A1F на #FEFFCF 18,21:1 AAA
Aa #1F0A1F на #FFEB99 15,69:1 AAA
Aa #4D1059 на #FEFFCF 13,31:1 AAA
Aa #1F0A1F на #FFC37A 11,89:1 AAA
Aa #4D1059 на #FFEB99 11,47:1 AAA
Aa #6B155E на #FEFFCF 10,78:1 AAA
Aa #6B155E на #FFEB99 9,29:1 AAA
Aa #4D1059 на #FFC37A 8,70:1 AAA
Aa #1F0A1F на #ED9A6D 8,42:1 AAA
Aa #8C2964 на #FEFFCF 7,80:1 AAA
Aa #6B155E на #FFC37A 7,04:1 AAA
Aa #8C2964 на #FFEB99 6,73:1 AA
Aa #A63169 на #FEFFCF 6,25:1 AA
Aa #4D1059 на #ED9A6D 6,16:1 AA
Aa #1F0A1F на #DE6B5B 5,67:1 AA
Aa #A63169 на #FFEB99 5,39:1 AA
Aa #8C2964 на #FFC37A 5,10:1 AA
Aa #6B155E на #ED9A6D 4,99:1 AA
Aa #C23E6E на #FEFFCF 4,85:1 AA
Aa #1F0A1F на #D94E6A 4,68:1 AA
Aa #C23E6E на #FFEB99 4,18:1 AA, великий текст
Aa #4D1059 на #DE6B5B 4,15:1 AA, великий текст
Aa #A63169 на #FFC37A 4,09:1 AA, великий текст
Aa #D94E6A на #FEFFCF 3,89:1 AA, великий текст
Aa #1F0A1F на #C23E6E 3,75:1 AA, великий текст
Aa #8C2964 на #ED9A6D 3,61:1 AA, великий текст
Aa #4D1059 на #D94E6A 3,42:1 AA, великий текст
Aa #6B155E на #DE6B5B 3,36:1 AA, великий текст
Aa #D94E6A на #FFEB99 3,35:1 AA, великий текст
Aa #DE6B5B на #FEFFCF 3,21:1 AA, великий текст
Aa #C23E6E на #FFC37A 3,17:1 AA, великий текст
Aa #1F0A1F на #A63169 2,91:1 Не проходить
Aa #A63169 на #ED9A6D 2,89:1 Не проходить
Aa #6B155E на #D94E6A 2,77:1 Не проходить
Aa #DE6B5B на #FFEB99 2,77:1 Не проходить
Aa #4D1059 на #C23E6E 2,74:1 Не проходить
Aa #D94E6A на #FFC37A 2,54:1 Не проходить
Aa #8C2964 на #DE6B5B 2,43:1 Не проходить
Aa #1F0A1F на #8C2964 2,33:1 Не проходить
Aa #C23E6E на #ED9A6D 2,24:1 Не проходить
Aa #6B155E на #C23E6E 2,22:1 Не проходить
Aa #ED9A6D на #FEFFCF 2,16:1 Не проходить
Aa #4D1059 на #A63169 2,13:1 Не проходить
Aa #DE6B5B на #FFC37A 2,10:1 Не проходить
Aa #8C2964 на #D94E6A 2,01:1 Не проходить
Aa #A63169 на #DE6B5B 1,95:1 Не проходить
Aa #ED9A6D на #FFEB99 1,86:1 Не проходить
Aa #D94E6A на #ED9A6D 1,80:1 Не проходить
Aa #6B155E на #A63169 1,72:1 Не проходить
Aa #4D1059 на #8C2964 1,71:1 Не проходить
Aa #1F0A1F на #6B155E 1,69:1 Не проходить
Aa #8C2964 на #C23E6E 1,61:1 Не проходить
Aa #A63169 на #D94E6A 1,61:1 Не проходить
Aa #FFC37A на #FEFFCF 1,53:1 Не проходить
Aa #C23E6E на #DE6B5B 1,51:1 Не проходить
Aa #DE6B5B на #ED9A6D 1,48:1 Не проходить
Aa #ED9A6D на #FFC37A 1,41:1 Не проходить
Aa #6B155E на #8C2964 1,38:1 Не проходить
Aa #1F0A1F на #4D1059 1,37:1 Не проходить
Aa #FFC37A на #FFEB99 1,32:1 Не проходить
Aa #A63169 на #C23E6E 1,29:1 Не проходить
Aa #8C2964 на #A63169 1,25:1 Не проходить
Aa #C23E6E на #D94E6A 1,25:1 Не проходить
Aa #4D1059 на #6B155E 1,23:1 Не проходить
Aa #D94E6A на #DE6B5B 1,21:1 Не проходить
Aa #FFEB99 на #FEFFCF 1,16: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 кольори