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

OrangeFall

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

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

OrangeFall

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

Редагувати
Яскраві 9 кольорів Теплі Темні Комплементарна fall monoramp colors autumn
Вподобання 28
Кольори 9

CSS-змінні

:root {
  --c-vibrant-1: #100820;
  --c-vibrant-2: #381038;
  --c-vibrant-3: #601840;
  --c-vibrant-4: #A01828;
  --c-vibrant-5: #D02020;
  --c-vibrant-6: #F85800;
  --c-vibrant-7: #F89800;
  --c-vibrant-8: #E8D028;
  --c-vibrant-9: #F0F8E0;
}

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

Ця яскрава палітра з 9 кольорів охоплює діапазон від Lemon Sugar (#F0F8E0), найсвітлішого тону, до Tristesse (#100820), найтемнішого. Вона об'єднує Tristesse, Synallactida, Soul Anchor, Cut Ruby, Lionheart, Willpower Orange, Jack-O, Polliwog та Lemon Sugar в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 36. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 14 з них, найконтрастніша — #100820 на #F0F8E0 (17,82:1).

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

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

Tristesse #100820
RGB
rgb(16, 8, 32)
HSL
hsl(260, 60%, 8%)
Яскравість
0,004
Synallactida #381038
RGB
rgb(56, 16, 56)
HSL
hsl(300, 56%, 14%)
Яскравість
0,015
Soul Anchor #601840
RGB
rgb(96, 24, 64)
HSL
hsl(327, 60%, 24%)
Яскравість
0,035
Cut Ruby #A01828
RGB
rgb(160, 24, 40)
HSL
hsl(353, 74%, 36%)
Яскравість
0,083
Lionheart #D02020
RGB
rgb(208, 32, 32)
HSL
hsl(0, 73%, 47%)
Яскравість
0,146
Willpower Orange #F85800
RGB
rgb(248, 88, 0)
HSL
hsl(21, 100%, 49%)
Яскравість
0,269
Jack-O #F89800
RGB
rgb(248, 152, 0)
HSL
hsl(37, 100%, 49%)
Яскравість
0,424
Polliwog #E8D028
RGB
rgb(232, 208, 40)
HSL
hsl(53, 81%, 53%)
Яскравість
0,624
Lemon Sugar #F0F8E0
RGB
rgb(240, 248, 224)
HSL
hsl(80, 63%, 93%)
Яскравість
0,910

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

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

Aa #100820 на #F0F8E0 17,82:1 AAA
Aa #381038 на #F0F8E0 14,78:1 AAA
Aa #100820 на #E8D028 12,51:1 AAA
Aa #601840 на #F0F8E0 11,29:1 AAA
Aa #381038 на #E8D028 10,38:1 AAA
Aa #100820 на #F89800 8,80:1 AAA
Aa #601840 на #E8D028 7,92:1 AAA
Aa #381038 на #F89800 7,30:1 AAA
Aa #A01828 на #F0F8E0 7,23:1 AAA
Aa #100820 на #F85800 5,93:1 AA
Aa #601840 на #F89800 5,57:1 AA
Aa #A01828 на #E8D028 5,08:1 AA
Aa #381038 на #F85800 4,92:1 AA
Aa #D02020 на #F0F8E0 4,91:1 AA
Aa #601840 на #F85800 3,75:1 AA, великий текст
Aa #100820 на #D02020 3,63:1 AA, великий текст
Aa #A01828 на #F89800 3,57:1 AA, великий текст
Aa #D02020 на #E8D028 3,45:1 AA, великий текст
Aa #381038 на #D02020 3,01:1 AA, великий текст
Aa #F85800 на #F0F8E0 3,01:1 AA, великий текст
Aa #100820 на #A01828 2,46:1 Не проходить
Aa #D02020 на #F89800 2,43:1 Не проходить
Aa #A01828 на #F85800 2,40:1 Не проходить
Aa #601840 на #D02020 2,30:1 Не проходить
Aa #F85800 на #E8D028 2,11:1 Не проходить
Aa #381038 на #A01828 2,04:1 Не проходить
Aa #F89800 на #F0F8E0 2,03:1 Не проходить
Aa #D02020 на #F85800 1,63:1 Не проходить
Aa #100820 на #601840 1,58:1 Не проходить
Aa #601840 на #A01828 1,56:1 Не проходить
Aa #F85800 на #F89800 1,48:1 Не проходить
Aa #A01828 на #D02020 1,47:1 Не проходить
Aa #F89800 на #E8D028 1,42:1 Не проходить
Aa #E8D028 на #F0F8E0 1,42:1 Не проходить
Aa #381038 на #601840 1,31:1 Не проходить
Aa #100820 на #381038 1,21:1 Не проходить

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

#000000 #3D0000 #950101 #FF0000
4 кольори
#E23E57 #88304E #522546 #311D3F
4 кольори
#FF204E #A0153E #5D0E41 #00224D
4 кольори
#030637 #3C0753 #720455 #910A67
4 кольори
#1C0A00 #361500 #603601 #CC9544
4 кольори
#252525 #FF0000 #AF0404 #414141
4 кольори
#362222 #171010 #423F3E #2B2B2B
4 кольори
#1A1A1D #3B1C32 #6A1E55 #A64D79
4 кольори