Реєстрація Реєстрація
12 Bit Rainbow

12 Bit Rainbow

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

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

12 Bit Rainbow

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

Редагувати
Яскраві 12 кольорів Теплі Змішані Комплементарна 12bit dataviz huechromaluminance
Вподобання 29
Кольори 12

CSS-змінні

:root {
  --c-vibrant-1: #881177;
  --c-vibrant-2: #AA3355;
  --c-vibrant-3: #CC6666;
  --c-vibrant-4: #EE9944;
  --c-vibrant-5: #EEDD00;
  --c-vibrant-6: #99DD55;
  --c-vibrant-7: #44DD88;
  --c-vibrant-8: #22CCBB;
  --c-vibrant-9: #00BBCC;
  --c-vibrant-10: #0099CC;
  --c-vibrant-11: #3366BB;
  --c-vibrant-12: #663399;
}

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

Ця яскрава палітра з 12 кольорів охоплює діапазон від Banana Clan (#EEDD00), найсвітлішого тону, до Royal Purpleness (#881177), найтемнішого. Вона об'єднує Royal Purpleness, Cranberry Sauce, Fuzzy Wuzzy, Mandarin Essence, Banana Clan, Lilliputian Lime, Drunken Dragonfly, Swimmers Pool, Turquoise Surf, Tomb Blue, Dover Straits та Rebecca Purple в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 7 з них, найконтрастніша — #881177 на #EEDD00 (6,26:1).

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

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

Royal Purpleness #881177
RGB
rgb(136, 17, 119)
HSL
hsl(309, 78%, 30%)
Яскравість
0,070
Cranberry Sauce #AA3355
RGB
rgb(170, 51, 85)
HSL
hsl(343, 54%, 43%)
Яскравість
0,116
Fuzzy Wuzzy #CC6666
RGB
rgb(204, 102, 102)
HSL
hsl(0, 50%, 60%)
Яскравість
0,233
Mandarin Essence #EE9944
RGB
rgb(238, 153, 68)
HSL
hsl(30, 83%, 60%)
Яскравість
0,414
Banana Clan #EEDD00
RGB
rgb(238, 221, 0)
HSL
hsl(56, 100%, 47%)
Яскравість
0,699
Lilliputian Lime #99DD55
RGB
rgb(153, 221, 85)
HSL
hsl(90, 67%, 60%)
Яскравість
0,591
Drunken Dragonfly #44DD88
RGB
rgb(68, 221, 136)
HSL
hsl(147, 69%, 57%)
Яскравість
0,547
Swimmers Pool #22CCBB
RGB
rgb(34, 204, 187)
HSL
hsl(174, 71%, 47%)
Яскравість
0,471
Turquoise Surf #00BBCC
RGB
rgb(0, 187, 204)
HSL
hsl(185, 100%, 40%)
Яскравість
0,399
Tomb Blue #0099CC
RGB
rgb(0, 153, 204)
HSL
hsl(195, 100%, 40%)
Яскравість
0,271
Dover Straits #3366BB
RGB
rgb(51, 102, 187)
HSL
hsl(218, 57%, 47%)
Яскравість
0,138
Rebecca Purple #663399
RGB
rgb(102, 51, 153)
HSL
hsl(270, 50%, 40%)
Яскравість
0,075

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

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

Aa #881177 на #EEDD00 6,26:1 AA
Aa #EEDD00 на #663399 5,99:1 AA
Aa #881177 на #99DD55 5,36:1 AA
Aa #99DD55 на #663399 5,13:1 AA
Aa #881177 на #44DD88 4,99:1 AA
Aa #44DD88 на #663399 4,78:1 AA
Aa #AA3355 на #EEDD00 4,52:1 AA
Aa #881177 на #22CCBB 4,35:1 AA, великий текст
Aa #22CCBB на #663399 4,17:1 AA, великий текст
Aa #EEDD00 на #3366BB 3,98:1 AA, великий текст
Aa #881177 на #EE9944 3,88:1 AA, великий текст
Aa #AA3355 на #99DD55 3,87:1 AA, великий текст
Aa #881177 на #00BBCC 3,75:1 AA, великий текст
Aa #EE9944 на #663399 3,71:1 AA, великий текст
Aa #AA3355 на #44DD88 3,60:1 AA, великий текст
Aa #00BBCC на #663399 3,59:1 AA, великий текст
Aa #99DD55 на #3366BB 3,41:1 AA, великий текст
Aa #44DD88 на #3366BB 3,18:1 AA, великий текст
Aa #AA3355 на #22CCBB 3,15:1 AA, великий текст
Aa #AA3355 на #EE9944 2,80:1 Не проходить
Aa #22CCBB на #3366BB 2,77:1 Не проходить
Aa #AA3355 на #00BBCC 2,71:1 Не проходить
Aa #881177 на #0099CC 2,69:1 Не проходить
Aa #CC6666 на #EEDD00 2,65:1 Не проходить
Aa #0099CC на #663399 2,57:1 Не проходить
Aa #EE9944 на #3366BB 2,47:1 Не проходить
Aa #00BBCC на #3366BB 2,39:1 Не проходить
Aa #881177 на #CC6666 2,36:1 Не проходить
Aa #EEDD00 на #0099CC 2,33:1 Не проходить
Aa #CC6666 на #99DD55 2,27:1 Не проходить
Aa #CC6666 на #663399 2,27:1 Не проходить
Aa #CC6666 на #44DD88 2,11:1 Не проходить
Aa #99DD55 на #0099CC 2,00:1 Не проходить
Aa #AA3355 на #0099CC 1,94:1 Не проходить
Aa #44DD88 на #0099CC 1,86:1 Не проходить
Aa #CC6666 на #22CCBB 1,84:1 Не проходить
Aa #AA3355 на #CC6666 1,71:1 Не проходить
Aa #0099CC на #3366BB 1,71:1 Не проходить
Aa #EEDD00 на #00BBCC 1,67:1 Не проходить
Aa #CC6666 на #EE9944 1,64:1 Не проходить
Aa #22CCBB на #0099CC 1,62:1 Не проходить
Aa #EE9944 на #EEDD00 1,61:1 Не проходить
Aa #CC6666 на #00BBCC 1,59:1 Не проходить
Aa #881177 на #3366BB 1,57:1 Не проходить
Aa #CC6666 на #3366BB 1,51:1 Не проходить
Aa #3366BB на #663399 1,50:1 Не проходить
Aa #EE9944 на #0099CC 1,44:1 Не проходить
Aa #EEDD00 на #22CCBB 1,44:1 Не проходить
Aa #99DD55 на #00BBCC 1,43:1 Не проходить
Aa #00BBCC на #0099CC 1,40:1 Не проходить
Aa #881177 на #AA3355 1,38:1 Не проходить
Aa #EE9944 на #99DD55 1,38:1 Не проходить
Aa #AA3355 на #663399 1,33:1 Не проходить
Aa #44DD88 на #00BBCC 1,33:1 Не проходить
Aa #EE9944 на #44DD88 1,29:1 Не проходить
Aa #EEDD00 на #44DD88 1,25:1 Не проходить
Aa #99DD55 на #22CCBB 1,23:1 Не проходить
Aa #EEDD00 на #99DD55 1,17:1 Не проходить
Aa #22CCBB на #00BBCC 1,16:1 Не проходить
Aa #44DD88 на #22CCBB 1,15:1 Не проходить
Aa #CC6666 на #0099CC 1,14:1 Не проходить
Aa #AA3355 на #3366BB 1,13:1 Не проходить
Aa #EE9944 на #22CCBB 1,12:1 Не проходить
Aa #99DD55 на #44DD88 1,07:1 Не проходить
Aa #881177 на #663399 1,04:1 Не проходить
Aa #EE9944 на #00BBCC 1,03: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 кольори