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

Permafrost12

Палітра з 12 кольорів · Холодні · Світлі · Аналогова гармонія

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

Permafrost12

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

Редагувати
Приглушені 12 кольорів Холодні Світлі Аналогова snow winter coolcolors
Вподобання 34
Кольори 12

CSS-змінні

:root {
  --c-muted-1: #A8C3D8;
  --c-muted-2: #C6DEE5;
  --c-muted-3: #DAEAEB;
  --c-muted-4: #E9F8F8;
  --c-muted-5: #243169;
  --c-muted-6: #4666A3;
  --c-muted-7: #6A93BE;
  --c-muted-8: #98C5DE;
  --c-muted-9: #3D6257;
  --c-muted-10: #49837A;
  --c-muted-11: #54A39E;
  --c-muted-12: #68B7BE;
}

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

Ця приглушена палітра з 12 кольорів охоплює діапазон від Melting Glacier (#E9F8F8), найсвітлішого тону, до Passionate Blue (#243169), найтемнішого. Вона об'єднує Frozen Blue, Light Blue Sloth, Tibetan Sky, Melting Glacier, Passionate Blue, Starstruck, Blue Marble, Bobby Blue, Emerson, Carlisle, Teal Bayou та Maritime Soft Blue в один набір, який можна одразу перенести в інтерфейс. Пар кольорів у палітрі: 66. Поріг контрастності WCAG AA (4,5:1) для основного тексту проходять 11 з них, найконтрастніша — #E9F8F8 на #243169 (11,2:1).

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

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

Frozen Blue #A8C3D8
RGB
rgb(168, 195, 216)
HSL
hsl(206, 38%, 75%)
Яскравість
0,523
Light Blue Sloth #C6DEE5
RGB
rgb(198, 222, 229)
HSL
hsl(194, 37%, 84%)
Яскравість
0,699
Tibetan Sky #DAEAEB
RGB
rgb(218, 234, 235)
HSL
hsl(184, 30%, 89%)
Яскравість
0,798
Melting Glacier #E9F8F8
RGB
rgb(233, 248, 248)
HSL
hsl(180, 52%, 94%)
Яскравість
0,912
Passionate Blue #243169
RGB
rgb(36, 49, 105)
HSL
hsl(229, 49%, 28%)
Яскравість
0,036
Starstruck #4666A3
RGB
rgb(70, 102, 163)
HSL
hsl(219, 40%, 46%)
Яскравість
0,135
Blue Marble #6A93BE
RGB
rgb(106, 147, 190)
HSL
hsl(211, 39%, 58%)
Яскравість
0,277
Bobby Blue #98C5DE
RGB
rgb(152, 197, 222)
HSL
hsl(201, 51%, 73%)
Яскравість
0,519
Emerson #3D6257
RGB
rgb(61, 98, 87)
HSL
hsl(162, 23%, 31%)
Яскравість
0,104
Carlisle #49837A
RGB
rgb(73, 131, 122)
HSL
hsl(171, 28%, 40%)
Яскравість
0,191
Teal Bayou #54A39E
RGB
rgb(84, 163, 158)
HSL
hsl(176, 32%, 48%)
Яскравість
0,306
Maritime Soft Blue #68B7BE
RGB
rgb(104, 183, 190)
HSL
hsl(185, 40%, 58%)
Яскравість
0,405

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

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

Aa #E9F8F8 на #243169 11,20:1 AAA
Aa #DAEAEB на #243169 9,86:1 AAA
Aa #C6DEE5 на #243169 8,72:1 AAA
Aa #A8C3D8 на #243169 6,67:1 AA
Aa #243169 на #98C5DE 6,62:1 AA
Aa #E9F8F8 на #3D6257 6,24:1 AA
Aa #DAEAEB на #3D6257 5,50:1 AA
Aa #243169 на #68B7BE 5,30:1 AA
Aa #E9F8F8 на #4666A3 5,22:1 AA
Aa #C6DEE5 на #3D6257 4,86:1 AA
Aa #DAEAEB на #4666A3 4,59:1 AA
Aa #243169 на #54A39E 4,14:1 AA, великий текст
Aa #C6DEE5 на #4666A3 4,06:1 AA, великий текст
Aa #E9F8F8 на #49837A 4,00:1 AA, великий текст
Aa #243169 на #6A93BE 3,80:1 AA, великий текст
Aa #A8C3D8 на #3D6257 3,72:1 AA, великий текст
Aa #98C5DE на #3D6257 3,69:1 AA, великий текст
Aa #DAEAEB на #49837A 3,52:1 AA, великий текст
Aa #A8C3D8 на #4666A3 3,11:1 AA, великий текст
Aa #C6DEE5 на #49837A 3,11:1 AA, великий текст
Aa #4666A3 на #98C5DE 3,08:1 AA, великий текст
Aa #E9F8F8 на #6A93BE 2,95:1 Не проходить
Aa #3D6257 на #68B7BE 2,95:1 Не проходить
Aa #243169 на #49837A 2,80:1 Не проходить
Aa #E9F8F8 на #54A39E 2,71:1 Не проходить
Aa #DAEAEB на #6A93BE 2,60:1 Не проходить
Aa #4666A3 на #68B7BE 2,47:1 Не проходить
Aa #A8C3D8 на #49837A 2,38:1 Не проходить
Aa #DAEAEB на #54A39E 2,38:1 Не проходить
Aa #98C5DE на #49837A 2,36:1 Не проходить
Aa #3D6257 на #54A39E 2,31:1 Не проходить
Aa #C6DEE5 на #6A93BE 2,29:1 Не проходить
Aa #243169 на #4666A3 2,15:1 Не проходить
Aa #6A93BE на #3D6257 2,12:1 Не проходить
Aa #C6DEE5 на #54A39E 2,11:1 Не проходить
Aa #E9F8F8 на #68B7BE 2,11:1 Не проходить
Aa #4666A3 на #54A39E 1,93:1 Не проходить
Aa #49837A на #68B7BE 1,89:1 Не проходить
Aa #DAEAEB на #68B7BE 1,86:1 Не проходить
Aa #243169 на #3D6257 1,79:1 Не проходить
Aa #4666A3 на #6A93BE 1,77:1 Не проходить
Aa #A8C3D8 на #6A93BE 1,76:1 Не проходить
Aa #6A93BE на #98C5DE 1,74:1 Не проходить
Aa #E9F8F8 на #98C5DE 1,69:1 Не проходить
Aa #A8C3D8 на #E9F8F8 1,68:1 Не проходить
Aa #C6DEE5 на #68B7BE 1,65:1 Не проходить
Aa #A8C3D8 на #54A39E 1,61:1 Не проходить
Aa #98C5DE на #54A39E 1,60:1 Не проходить
Aa #3D6257 на #49837A 1,56:1 Не проходить
Aa #DAEAEB на #98C5DE 1,49:1 Не проходить
Aa #A8C3D8 на #DAEAEB 1,48:1 Не проходить
Aa #49837A на #54A39E 1,48:1 Не проходить
Aa #6A93BE на #68B7BE 1,39:1 Не проходить
Aa #6A93BE на #49837A 1,36:1 Не проходить
Aa #C6DEE5 на #98C5DE 1,32:1 Не проходить
Aa #A8C3D8 на #C6DEE5 1,31:1 Не проходить
Aa #4666A3 на #49837A 1,30:1 Не проходить
Aa #C6DEE5 на #E9F8F8 1,28:1 Не проходить
Aa #54A39E на #68B7BE 1,28:1 Не проходить
Aa #A8C3D8 на #68B7BE 1,26:1 Не проходить
Aa #98C5DE на #68B7BE 1,25:1 Не проходить
Aa #4666A3 на #3D6257 1,20:1 Не проходить
Aa #DAEAEB на #E9F8F8 1,14:1 Не проходить
Aa #C6DEE5 на #DAEAEB 1,13:1 Не проходить
Aa #6A93BE на #54A39E 1,09:1 Не проходить
Aa #A8C3D8 на #98C5DE 1,01:1 Не проходить

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

#E3FDFD #CBF1F5 #A6E3E9 #71C9CE
4 кольори
#F4EEFF #DCD6F7 #A6B1E1 #424874
4 кольори
#B1B2FF #AAC4FF #D2DAFF #EEF1FF
4 кольори
#6096B4 #93BFCF #BDCDD6 #EEE9DA
4 кольори
#A8D8EA #AA96DA #FCBAD3 #FFFFD2
4 кольори
#DEFCF9 #CADEFC #C3BEF0 #CCA8E9
4 кольори
#F7FBFC #D6E6F2 #B9D7EA #769FCD
4 кольори
#C4DFDF #D2E9E9 #E3F4F4 #F8F6F4
4 кольори