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

CC 12

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

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

CC 12

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

Редагувати
Приглушені 12 кольорів Холодні Змішані Тріадна simple 12color colorful bright
Вподобання 20
Кольори 12

CSS-змінні

:root {
  --c-muted-1: #5F5652;
  --c-muted-2: #919C8C;
  --c-muted-3: #E4EBF0;
  --c-muted-4: #1E173F;
  --c-muted-5: #7542B7;
  --c-muted-6: #E64DEE;
  --c-muted-7: #1A7194;
  --c-muted-8: #44CA9D;
  --c-muted-9: #A9EB3E;
  --c-muted-10: #C83822;
  --c-muted-11: #E98E51;
  --c-muted-12: #FFFAA7;
}

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

Ця приглушена палітра з 12 кольорів охоплює діапазон від Lemon Slice (#FFFAA7), найсвітлішого тону, до Prune Plum (#1E173F), найтемнішого. Вона об'єднує Timber Brown, Charcoal Tint, Himalaya Peaks, Prune Plum, Purple Rain, Lake Retba Pink, Bateau, Mint Jelly, Dynamic Green, Red Sauce Parlour, Toasted Husk та Lemon Slice в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 16 з них, найконтрастніша — #1E173F на #FFFAA7 (15,59:1).

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

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

Timber Brown #5F5652
RGB
rgb(95, 86, 82)
HSL
hsl(18, 7%, 35%)
Яскравість
0,097
Charcoal Tint #919C8C
RGB
rgb(145, 156, 140)
HSL
hsl(101, 7%, 58%)
Яскравість
0,317
Himalaya Peaks #E4EBF0
RGB
rgb(228, 235, 240)
HSL
hsl(205, 29%, 92%)
Яскравість
0,822
Prune Plum #1E173F
RGB
rgb(30, 23, 63)
HSL
hsl(251, 47%, 17%)
Яскравість
0,013
Purple Rain #7542B7
RGB
rgb(117, 66, 183)
HSL
hsl(266, 47%, 49%)
Яскравість
0,111
Lake Retba Pink #E64DEE
RGB
rgb(230, 77, 238)
HSL
hsl(297, 83%, 62%)
Яскравість
0,283
Bateau #1A7194
RGB
rgb(26, 113, 148)
HSL
hsl(197, 70%, 34%)
Яскравість
0,142
Mint Jelly #44CA9D
RGB
rgb(68, 202, 157)
HSL
hsl(160, 56%, 53%)
Яскравість
0,459
Dynamic Green #A9EB3E
RGB
rgb(169, 235, 62)
HSL
hsl(83, 81%, 58%)
Яскравість
0,682
Red Sauce Parlour #C83822
RGB
rgb(200, 56, 34)
HSL
hsl(8, 71%, 46%)
Яскравість
0,152
Toasted Husk #E98E51
RGB
rgb(233, 142, 81)
HSL
hsl(24, 78%, 62%)
Яскравість
0,373
Lemon Slice #FFFAA7
RGB
rgb(255, 250, 167)
HSL
hsl(57, 100%, 83%)
Яскравість
0,924

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

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

Aa #1E173F на #FFFAA7 15,59:1 AAA
Aa #E4EBF0 на #1E173F 13,96:1 AAA
Aa #1E173F на #A9EB3E 11,72:1 AAA
Aa #1E173F на #44CA9D 8,15:1 AAA
Aa #1E173F на #E98E51 6,76:1 AA
Aa #5F5652 на #FFFAA7 6,63:1 AA
Aa #7542B7 на #FFFAA7 6,05:1 AA
Aa #5F5652 на #E4EBF0 5,93:1 AA
Aa #919C8C на #1E173F 5,87:1 AA
Aa #E4EBF0 на #7542B7 5,42:1 AA
Aa #1E173F на #E64DEE 5,33:1 AA
Aa #1A7194 на #FFFAA7 5,08:1 AA
Aa #5F5652 на #A9EB3E 4,98:1 AA
Aa #C83822 на #FFFAA7 4,82:1 AA
Aa #E4EBF0 на #1A7194 4,55:1 AA
Aa #7542B7 на #A9EB3E 4,55:1 AA
Aa #E4EBF0 на #C83822 4,31:1 AA, великий текст
Aa #1A7194 на #A9EB3E 3,82:1 AA, великий текст
Aa #A9EB3E на #C83822 3,62:1 AA, великий текст
Aa #5F5652 на #44CA9D 3,46:1 AA, великий текст
Aa #1E173F на #C83822 3,24:1 AA, великий текст
Aa #7542B7 на #44CA9D 3,16:1 AA, великий текст
Aa #1E173F на #1A7194 3,07:1 AA, великий текст
Aa #E64DEE на #FFFAA7 2,93:1 Не проходить
Aa #5F5652 на #E98E51 2,88:1 Не проходить
Aa #919C8C на #FFFAA7 2,66:1 Не проходить
Aa #1A7194 на #44CA9D 2,66:1 Не проходить
Aa #7542B7 на #E98E51 2,63:1 Не проходить
Aa #E4EBF0 на #E64DEE 2,62:1 Не проходить
Aa #1E173F на #7542B7 2,58:1 Не проходить
Aa #44CA9D на #C83822 2,52:1 Не проходить
Aa #5F5652 на #919C8C 2,50:1 Не проходить
Aa #919C8C на #E4EBF0 2,38:1 Не проходить
Aa #5F5652 на #1E173F 2,35:1 Не проходить
Aa #E98E51 на #FFFAA7 2,31:1 Не проходить
Aa #919C8C на #7542B7 2,28:1 Не проходить
Aa #5F5652 на #E64DEE 2,27:1 Не проходить
Aa #E64DEE на #A9EB3E 2,20:1 Не проходить
Aa #1A7194 на #E98E51 2,20:1 Не проходить
Aa #C83822 на #E98E51 2,09:1 Не проходить
Aa #7542B7 на #E64DEE 2,07:1 Не проходить
Aa #E4EBF0 на #E98E51 2,06:1 Не проходить
Aa #919C8C на #A9EB3E 2,00:1 Не проходить
Aa #919C8C на #1A7194 1,91:1 Не проходить
Aa #44CA9D на #FFFAA7 1,91:1 Не проходить
Aa #919C8C на #C83822 1,81:1 Не проходить
Aa #E64DEE на #1A7194 1,74:1 Не проходить
Aa #A9EB3E на #E98E51 1,73:1 Не проходить
Aa #E4EBF0 на #44CA9D 1,71:1 Не проходить
Aa #E64DEE на #C83822 1,65:1 Не проходить
Aa #E64DEE на #44CA9D 1,53:1 Не проходить
Aa #44CA9D на #A9EB3E 1,44:1 Не проходить
Aa #919C8C на #44CA9D 1,39:1 Не проходить
Aa #5F5652 на #C83822 1,38:1 Не проходить
Aa #A9EB3E на #FFFAA7 1,33:1 Не проходить
Aa #5F5652 на #1A7194 1,30:1 Не проходить
Aa #E64DEE на #E98E51 1,27:1 Не проходить
Aa #7542B7 на #C83822 1,26:1 Не проходить
Aa #44CA9D на #E98E51 1,20:1 Не проходить
Aa #E4EBF0 на #A9EB3E 1,19:1 Не проходить
Aa #7542B7 на #1A7194 1,19:1 Не проходить
Aa #919C8C на #E98E51 1,15:1 Не проходить
Aa #E4EBF0 на #FFFAA7 1,12:1 Не проходить
Aa #5F5652 на #7542B7 1,10:1 Не проходить
Aa #919C8C на #E64DEE 1,10:1 Не проходить
Aa #1A7194 на #C83822 1,06: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 кольори