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

Brite12

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

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

Brite12

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

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

CSS-змінні

:root {
  --c-vibrant-1: #D30935;
  --c-vibrant-2: #FB8C1A;
  --c-vibrant-3: #F8E930;
  --c-vibrant-4: #0EA145;
  --c-vibrant-5: #17B1F3;
  --c-vibrant-6: #0B2FDD;
  --c-vibrant-7: #5B00AF;
  --c-vibrant-8: #FE4AD3;
  --c-vibrant-9: #EAE9E5;
  --c-vibrant-10: #6F7C9A;
  --c-vibrant-11: #031133;
  --c-vibrant-12: #874501;
}

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

Ця яскрава палітра з 12 кольорів охоплює діапазон від Blanco (#EAE9E5), найсвітлішого тону, до Squid’s Ink (#031133), найтемнішого. Вона об'єднує Cherry, Laddu Orange, Banana Bombshell, Boogie Blast, Zima Blue, Cold Pack, Aubergine Perl, Mat Dazzle Rose, Blanco, Infinity and Beyond, Squid’s Ink та Chocolate Pancakes в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 12 з них, найконтрастніша — #EAE9E5 на #031133 (15,27:1).

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

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

Cherry #D30935
RGB
rgb(211, 9, 53)
HSL
hsl(347, 92%, 43%)
Яскравість
0,143
Laddu Orange #FB8C1A
RGB
rgb(251, 140, 26)
HSL
hsl(30, 97%, 54%)
Яскравість
0,393
Banana Bombshell #F8E930
RGB
rgb(248, 233, 48)
HSL
hsl(56, 93%, 58%)
Яскравість
0,785
Boogie Blast #0EA145
RGB
rgb(14, 161, 69)
HSL
hsl(142, 84%, 34%)
Яскравість
0,260
Zima Blue #17B1F3
RGB
rgb(23, 177, 243)
HSL
hsl(198, 90%, 52%)
Яскравість
0,381
Cold Pack #0B2FDD
RGB
rgb(11, 47, 221)
HSL
hsl(230, 91%, 45%)
Яскравість
0,073
Aubergine Perl #5B00AF
RGB
rgb(91, 0, 175)
HSL
hsl(271, 100%, 34%)
Яскравість
0,053
Mat Dazzle Rose #FE4AD3
RGB
rgb(254, 74, 211)
HSL
hsl(314, 99%, 64%)
Яскравість
0,307
Blanco #EAE9E5
RGB
rgb(234, 233, 229)
HSL
hsl(48, 11%, 91%)
Яскравість
0,814
Infinity and Beyond #6F7C9A
RGB
rgb(111, 124, 154)
HSL
hsl(222, 18%, 52%)
Яскравість
0,201
Squid’s Ink #031133
RGB
rgb(3, 17, 51)
HSL
hsl(223, 89%, 11%)
Яскравість
0,007
Chocolate Pancakes #874501
RGB
rgb(135, 69, 1)
HSL
hsl(30, 99%, 27%)
Яскравість
0,094

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

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

Aa #EAE9E5 на #031133 15,27:1 AAA
Aa #F8E930 на #031133 14,75:1 AAA
Aa #5B00AF на #EAE9E5 8,38:1 AAA
Aa #F8E930 на #5B00AF 8,09:1 AAA
Aa #FB8C1A на #031133 7,83:1 AAA
Aa #17B1F3 на #031133 7,62:1 AAA
Aa #0B2FDD на #EAE9E5 7,01:1 AAA
Aa #F8E930 на #0B2FDD 6,77:1 AA
Aa #FE4AD3 на #031133 6,30:1 AA
Aa #EAE9E5 на #874501 6,00:1 AA
Aa #F8E930 на #874501 5,79:1 AA
Aa #0EA145 на #031133 5,48:1 AA
Aa #D30935 на #EAE9E5 4,48:1 AA, великий текст
Aa #6F7C9A на #031133 4,44:1 AA, великий текст
Aa #D30935 на #F8E930 4,32:1 AA, великий текст
Aa #FB8C1A на #5B00AF 4,30:1 AA, великий текст
Aa #17B1F3 на #5B00AF 4,18:1 AA, великий текст
Aa #FB8C1A на #0B2FDD 3,60:1 AA, великий текст
Aa #17B1F3 на #0B2FDD 3,50:1 AA, великий текст
Aa #5B00AF на #FE4AD3 3,46:1 AA, великий текст
Aa #EAE9E5 на #6F7C9A 3,44:1 AA, великий текст
Aa #D30935 на #031133 3,41:1 AA, великий текст
Aa #F8E930 на #6F7C9A 3,32:1 AA, великий текст
Aa #FB8C1A на #874501 3,08:1 AA, великий текст
Aa #0EA145 на #5B00AF 3,01:1 AA, великий текст
Aa #17B1F3 на #874501 2,99:1 Не проходить
Aa #0B2FDD на #FE4AD3 2,89:1 Не проходить
Aa #0EA145 на #EAE9E5 2,79:1 Не проходить
Aa #F8E930 на #0EA145 2,69:1 Не проходить
Aa #031133 на #874501 2,55:1 Не проходить
Aa #0EA145 на #0B2FDD 2,52:1 Не проходить
Aa #FE4AD3 на #874501 2,48:1 Не проходить
Aa #5B00AF на #6F7C9A 2,44:1 Не проходить
Aa #FE4AD3 на #EAE9E5 2,42:1 Не проходить
Aa #F8E930 на #FE4AD3 2,34:1 Не проходить
Aa #D30935 на #FB8C1A 2,30:1 Не проходить
Aa #D30935 на #17B1F3 2,23:1 Не проходить
Aa #0B2FDD на #031133 2,18:1 Не проходить
Aa #0EA145 на #874501 2,15:1 Не проходить
Aa #0B2FDD на #6F7C9A 2,04:1 Не проходить
Aa #17B1F3 на #EAE9E5 2,01:1 Не проходить
Aa #FB8C1A на #EAE9E5 1,95:1 Не проходить
Aa #F8E930 на #17B1F3 1,94:1 Не проходить
Aa #FB8C1A на #F8E930 1,88:1 Не проходить
Aa #D30935 на #5B00AF 1,87:1 Не проходить
Aa #D30935 на #FE4AD3 1,85:1 Не проходить
Aa #5B00AF на #031133 1,82:1 Не проходить
Aa #FB8C1A на #6F7C9A 1,76:1 Не проходить
Aa #6F7C9A на #874501 1,74:1 Не проходить
Aa #17B1F3 на #6F7C9A 1,72:1 Не проходить
Aa #D30935 на #0EA145 1,61:1 Не проходить
Aa #D30935 на #0B2FDD 1,57:1 Не проходить
Aa #FB8C1A на #0EA145 1,43:1 Не проходить
Aa #FE4AD3 на #6F7C9A 1,42:1 Не проходить
Aa #5B00AF на #874501 1,40:1 Не проходить
Aa #0EA145 на #17B1F3 1,39:1 Не проходить
Aa #D30935 на #874501 1,34:1 Не проходить
Aa #D30935 на #6F7C9A 1,30:1 Не проходить
Aa #FB8C1A на #FE4AD3 1,24:1 Не проходить
Aa #0EA145 на #6F7C9A 1,23:1 Не проходить
Aa #17B1F3 на #FE4AD3 1,21:1 Не проходить
Aa #0B2FDD на #5B00AF 1,19:1 Не проходить
Aa #0B2FDD на #874501 1,17:1 Не проходить
Aa #0EA145 на #FE4AD3 1,15:1 Не проходить
Aa #F8E930 на #EAE9E5 1,04:1 Не проходить
Aa #FB8C1A на #17B1F3 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 кольори