Реєстрація Реєстрація
TY Artificial Happiness 12

TY Artificial Happiness 12

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

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

TY Artificial Happiness 12

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

Редагувати
Приглушені 12 кольорів Холодні Змішані Комплементарна limited happy versatile bright
Вподобання 15
Кольори 12

CSS-змінні

:root {
  --c-muted-1: #76CFCF;
  --c-muted-2: #55AA65;
  --c-muted-3: #4D749A;
  --c-muted-4: #5A4C49;
  --c-muted-5: #9F81C5;
  --c-muted-6: #B55E86;
  --c-muted-7: #3D2D4D;
  --c-muted-8: #202020;
  --c-muted-9: #E4D3D3;
  --c-muted-10: #D59A4A;
  --c-muted-11: #9A5632;
  --c-muted-12: #6A3933;
}

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

Ця приглушена палітра з 12 кольорів охоплює діапазон від Theatre Powder Rose (#E4D3D3), найсвітлішого тону, до Lead (#202020), найтемнішого. Вона об'єднує Soft Turquoise, Deep Mint, Hammerhead Shark, Piano Brown, Lilac Purple, Dahlia Mauve, Jagger, Lead, Theatre Powder Rose, Georgian Yellow, Seared Earth та Sanguine Brown в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 12 з них, найконтрастніша — #202020 на #E4D3D3 (11,29:1).

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

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

Soft Turquoise #76CFCF
RGB
rgb(118, 207, 207)
HSL
hsl(180, 48%, 64%)
Яскравість
0,530
Deep Mint #55AA65
RGB
rgb(85, 170, 101)
HSL
hsl(131, 33%, 50%)
Яскравість
0,316
Hammerhead Shark #4D749A
RGB
rgb(77, 116, 154)
HSL
hsl(210, 33%, 45%)
Яскравість
0,164
Piano Brown #5A4C49
RGB
rgb(90, 76, 73)
HSL
hsl(11, 10%, 32%)
Яскравість
0,078
Lilac Purple #9F81C5
RGB
rgb(159, 129, 197)
HSL
hsl(266, 37%, 64%)
Яскравість
0,271
Dahlia Mauve #B55E86
RGB
rgb(181, 94, 134)
HSL
hsl(332, 37%, 54%)
Яскравість
0,196
Jagger #3D2D4D
RGB
rgb(61, 45, 77)
HSL
hsl(270, 26%, 24%)
Яскравість
0,034
Lead #202020
RGB
rgb(32, 32, 32)
HSL
hsl(0, 0%, 13%)
Яскравість
0,014
Theatre Powder Rose #E4D3D3
RGB
rgb(228, 211, 211)
HSL
hsl(0, 24%, 86%)
Яскравість
0,678
Georgian Yellow #D59A4A
RGB
rgb(213, 154, 74)
HSL
hsl(35, 62%, 56%)
Яскравість
0,378
Seared Earth #9A5632
RGB
rgb(154, 86, 50)
HSL
hsl(21, 51%, 40%)
Яскравість
0,138
Sanguine Brown #6A3933
RGB
rgb(106, 57, 51)
HSL
hsl(7, 35%, 31%)
Яскравість
0,062

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

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

Aa #202020 на #E4D3D3 11,29:1 AAA
Aa #76CFCF на #202020 9,00:1 AAA
Aa #3D2D4D на #E4D3D3 8,66:1 AAA
Aa #76CFCF на #3D2D4D 6,90:1 AA
Aa #202020 на #D59A4A 6,63:1 AA
Aa #E4D3D3 на #6A3933 6,48:1 AA
Aa #55AA65 на #202020 5,68:1 AA
Aa #5A4C49 на #E4D3D3 5,68:1 AA
Aa #76CFCF на #6A3933 5,16:1 AA
Aa #3D2D4D на #D59A4A 5,09:1 AA
Aa #9F81C5 на #202020 4,98:1 AA
Aa #76CFCF на #5A4C49 4,52:1 AA
Aa #55AA65 на #3D2D4D 4,36:1 AA, великий текст
Aa #E4D3D3 на #9A5632 3,88:1 AA, великий текст
Aa #9F81C5 на #3D2D4D 3,82:1 AA, великий текст
Aa #B55E86 на #202020 3,81:1 AA, великий текст
Aa #D59A4A на #6A3933 3,81:1 AA, великий текст
Aa #4D749A на #E4D3D3 3,40:1 AA, великий текст
Aa #5A4C49 на #D59A4A 3,33:1 AA, великий текст
Aa #4D749A на #202020 3,32:1 AA, великий текст
Aa #55AA65 на #6A3933 3,26:1 AA, великий текст
Aa #76CFCF на #9A5632 3,09:1 AA, великий текст
Aa #B55E86 на #E4D3D3 2,96:1 Не проходить
Aa #B55E86 на #3D2D4D 2,92:1 Не проходить
Aa #202020 на #9A5632 2,91:1 Не проходить
Aa #55AA65 на #5A4C49 2,86:1 Не проходить
Aa #9F81C5 на #6A3933 2,86:1 Не проходить
Aa #76CFCF на #4D749A 2,71:1 Не проходить
Aa #4D749A на #3D2D4D 2,55:1 Не проходить
Aa #5A4C49 на #9F81C5 2,50:1 Не проходить
Aa #76CFCF на #B55E86 2,36:1 Не проходить
Aa #D59A4A на #9A5632 2,28:1 Не проходить
Aa #9F81C5 на #E4D3D3 2,27:1 Не проходить
Aa #3D2D4D на #9A5632 2,23:1 Не проходить
Aa #B55E86 на #6A3933 2,19:1 Не проходить
Aa #4D749A на #D59A4A 2,00:1 Не проходить
Aa #55AA65 на #E4D3D3 1,99:1 Не проходить
Aa #5A4C49 на #202020 1,99:1 Не проходить
Aa #55AA65 на #9A5632 1,95:1 Не проходить
Aa #4D749A на #6A3933 1,91:1 Не проходить
Aa #5A4C49 на #B55E86 1,91:1 Не проходить
Aa #76CFCF на #9F81C5 1,81:1 Не проходить
Aa #B55E86 на #D59A4A 1,74:1 Не проходить
Aa #202020 на #6A3933 1,74:1 Не проходить
Aa #55AA65 на #4D749A 1,71:1 Не проходить
Aa #9F81C5 на #9A5632 1,71:1 Не проходить
Aa #E4D3D3 на #D59A4A 1,70:1 Не проходить
Aa #4D749A на #5A4C49 1,67:1 Не проходить
Aa #9A5632 на #6A3933 1,67:1 Не проходить
Aa #76CFCF на #55AA65 1,58:1 Не проходить
Aa #5A4C49 на #3D2D4D 1,53:1 Не проходить
Aa #4D749A на #9F81C5 1,50:1 Не проходить
Aa #55AA65 на #B55E86 1,49:1 Не проходить
Aa #5A4C49 на #9A5632 1,46:1 Не проходить
Aa #76CFCF на #D59A4A 1,36:1 Не проходить
Aa #3D2D4D на #6A3933 1,34:1 Не проходить
Aa #9F81C5 на #D59A4A 1,33:1 Не проходить
Aa #9F81C5 на #B55E86 1,31:1 Не проходить
Aa #B55E86 на #9A5632 1,31:1 Не проходить
Aa #3D2D4D на #202020 1,30:1 Не проходить
Aa #76CFCF на #E4D3D3 1,26:1 Не проходить
Aa #55AA65 на #D59A4A 1,17:1 Не проходить
Aa #4D749A на #B55E86 1,15:1 Не проходить
Aa #55AA65 на #9F81C5 1,14:1 Не проходить
Aa #4D749A на #9A5632 1,14:1 Не проходить
Aa #5A4C49 на #6A3933 1,14:1 Не проходить

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

#222831 #393E46 #00ADB5 #EEEEEE
4 кольори
#F9F7F7 #DBE2EF #3F72AF #112D4E
4 кольори
#1B262C #0F4C75 #3282B8 #BBE1FA
4 кольори
#08D9D6 #252A34 #FF2E63 #EAEAEA
4 кольори
#27374D #526D82 #9DB2BF #DDE6ED
4 кольори
#364F6B #3FC1C9 #F5F5F5 #FC5185
4 кольори
#E4F9F5 #30E3CA #11999E #40514E
4 кольори
#F0F5F9 #C9D6DF #52616B #1E2022
4 кольори