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

RYB 12

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

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

RYB 12

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

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

CSS-змінні

:root {
  --c-vibrant-1: #362338;
  --c-vibrant-2: #463C71;
  --c-vibrant-3: #477BA4;
  --c-vibrant-4: #7CC667;
  --c-vibrant-5: #DDF166;
  --c-vibrant-6: #FFF7CF;
  --c-vibrant-7: #FFF2AF;
  --c-vibrant-8: #FFDC78;
  --c-vibrant-9: #FF5168;
  --c-vibrant-10: #E83DAC;
  --c-vibrant-11: #D20962;
  --c-vibrant-12: #AB0030;
}

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

Ця яскрава палітра з 12 кольорів охоплює діапазон від Baja White (#FFF7CF), найсвітлішого тону, до Fat Tuesday (#362338), найтемнішого. Вона об'єднує Fat Tuesday, Opera Blue, Zenith, Energise, Mindaro, Baja White, Paper Tiger, Sunlit, Festive Fennec, Pink Bite, Xīpe Totēc Red та Chernobog в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 17 з них, найконтрастніша — #362338 на #FFF7CF (13,38:1).

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

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

Fat Tuesday #362338
RGB
rgb(54, 35, 56)
HSL
hsl(294, 23%, 18%)
Яскравість
0,023
Opera Blue #463C71
RGB
rgb(70, 60, 113)
HSL
hsl(251, 31%, 34%)
Яскравість
0,057
Zenith #477BA4
RGB
rgb(71, 123, 164)
HSL
hsl(206, 40%, 46%)
Яскравість
0,182
Energise #7CC667
RGB
rgb(124, 198, 103)
HSL
hsl(107, 45%, 59%)
Яскравість
0,457
Mindaro #DDF166
RGB
rgb(221, 241, 102)
HSL
hsl(69, 83%, 67%)
Яскравість
0,792
Baja White #FFF7CF
RGB
rgb(255, 247, 207)
HSL
hsl(50, 100%, 91%)
Яскравість
0,923
Paper Tiger #FFF2AF
RGB
rgb(255, 242, 175)
HSL
hsl(50, 100%, 84%)
Яскравість
0,879
Sunlit #FFDC78
RGB
rgb(255, 220, 120)
HSL
hsl(44, 100%, 74%)
Яскравість
0,738
Festive Fennec #FF5168
RGB
rgb(255, 81, 104)
HSL
hsl(352, 100%, 66%)
Яскравість
0,281
Pink Bite #E83DAC
RGB
rgb(232, 61, 172)
HSL
hsl(321, 79%, 57%)
Яскравість
0,235
Xīpe Totēc Red #D20962
RGB
rgb(210, 9, 98)
HSL
hsl(333, 92%, 43%)
Яскравість
0,148
Chernobog #AB0030
RGB
rgb(171, 0, 48)
HSL
hsl(343, 100%, 34%)
Яскравість
0,089

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

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

Aa #362338 на #FFF7CF 13,38:1 AAA
Aa #362338 на #FFF2AF 12,77:1 AAA
Aa #362338 на #DDF166 11,58:1 AAA
Aa #362338 на #FFDC78 10,84:1 AAA
Aa #463C71 на #FFF7CF 9,07:1 AAA
Aa #463C71 на #FFF2AF 8,66:1 AAA
Aa #463C71 на #DDF166 7,85:1 AAA
Aa #463C71 на #FFDC78 7,35:1 AAA
Aa #FFF7CF на #AB0030 7,01:1 AAA
Aa #362338 на #7CC667 6,97:1 AA
Aa #FFF2AF на #AB0030 6,69:1 AA
Aa #DDF166 на #AB0030 6,07:1 AA
Aa #FFDC78 на #AB0030 5,68:1 AA
Aa #FFF7CF на #D20962 4,92:1 AA
Aa #463C71 на #7CC667 4,72:1 AA
Aa #FFF2AF на #D20962 4,69:1 AA
Aa #362338 на #FF5168 4,56:1 AA
Aa #DDF166 на #D20962 4,26:1 AA, великий текст
Aa #477BA4 на #FFF7CF 4,20:1 AA, великий текст
Aa #477BA4 на #FFF2AF 4,01:1 AA, великий текст
Aa #FFDC78 на #D20962 3,98:1 AA, великий текст
Aa #362338 на #E83DAC 3,92:1 AA, великий текст
Aa #7CC667 на #AB0030 3,65:1 AA, великий текст
Aa #477BA4 на #DDF166 3,63:1 AA, великий текст
Aa #FFF7CF на #E83DAC 3,42:1 AA, великий текст
Aa #477BA4 на #FFDC78 3,40:1 AA, великий текст
Aa #FFF2AF на #E83DAC 3,26:1 AA, великий текст
Aa #362338 на #477BA4 3,19:1 AA, великий текст
Aa #463C71 на #FF5168 3,09:1 AA, великий текст
Aa #DDF166 на #E83DAC 2,96:1 Не проходить
Aa #FFF7CF на #FF5168 2,94:1 Не проходить
Aa #FFF2AF на #FF5168 2,80:1 Не проходить
Aa #FFDC78 на #E83DAC 2,77:1 Не проходить
Aa #362338 на #D20962 2,72:1 Не проходить
Aa #463C71 на #E83DAC 2,65:1 Не проходить
Aa #7CC667 на #D20962 2,56:1 Не проходить
Aa #DDF166 на #FF5168 2,54:1 Не проходить
Aa #FF5168 на #AB0030 2,39:1 Не проходить
Aa #FFDC78 на #FF5168 2,38:1 Не проходить
Aa #477BA4 на #7CC667 2,18:1 Не проходить
Aa #463C71 на #477BA4 2,16:1 Не проходить
Aa #E83DAC на #AB0030 2,05:1 Не проходить
Aa #7CC667 на #FFF7CF 1,92:1 Не проходить
Aa #362338 на #AB0030 1,91:1 Не проходить
Aa #463C71 на #D20962 1,84:1 Не проходить
Aa #7CC667 на #FFF2AF 1,83:1 Не проходить
Aa #7CC667 на #E83DAC 1,78:1 Не проходить
Aa #FF5168 на #D20962 1,68:1 Не проходить
Aa #477BA4 на #AB0030 1,67:1 Не проходить
Aa #7CC667 на #DDF166 1,66:1 Не проходить
Aa #7CC667 на #FFDC78 1,56:1 Не проходить
Aa #7CC667 на #FF5168 1,53:1 Не проходить
Aa #362338 на #463C71 1,48:1 Не проходить
Aa #E83DAC на #D20962 1,44:1 Не проходить
Aa #477BA4 на #FF5168 1,43:1 Не проходить
Aa #D20962 на #AB0030 1,43:1 Не проходить
Aa #463C71 на #AB0030 1,29:1 Не проходить
Aa #477BA4 на #E83DAC 1,23:1 Не проходить
Aa #FFF7CF на #FFDC78 1,23:1 Не проходить
Aa #FFF2AF на #FFDC78 1,18:1 Не проходить
Aa #477BA4 на #D20962 1,17:1 Не проходить
Aa #FF5168 на #E83DAC 1,16:1 Не проходить
Aa #DDF166 на #FFF7CF 1,15:1 Не проходить
Aa #DDF166 на #FFF2AF 1,10:1 Не проходить
Aa #DDF166 на #FFDC78 1,07:1 Не проходить
Aa #FFF7CF на #FFF2AF 1,05: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 кольори