Winter Frost Color Palette
A frosted-window palette: ice white, glacial blue, silver-grey, deep winter navy, and a cool lavender hush. Crisp and cold, it reads as snow, frost, and long blue dusks rather than cozy holiday warmth. For winter scenes, frosty packaging, and cool seasonal branding.
Get Paintrix free on the App Store.
Download
Hex codes
Color theory
Base
Complement
Analogous −30°
Analogous +30°
Triadic
Use it for
Code formats
CSS
:root {
--winter-frost-1: #EEF4F8;
--winter-frost-2: #DEE9F0;
--winter-frost-3: #CDDEE8;
--winter-frost-4: #BCD2E0;
--winter-frost-5: #A9C5D8;
--winter-frost-6: #96B8CF;
--winter-frost-7: #7FAAC8;
--winter-frost-8: #6E9CBE;
--winter-frost-9: #5D8EB2;
--winter-frost-10: #4D80A4;
--winter-frost-11: #3F7296;
--winter-frost-12: #336486;
--winter-frost-13: #D2D8DC;
--winter-frost-14: #BCC4CA;
--winter-frost-15: #A5AFB6;
--winter-frost-16: #8E99A1;
--winter-frost-17: #78838C;
--winter-frost-18: #636E77;
--winter-frost-19: #2A4866;
--winter-frost-20: #244058;
--winter-frost-21: #1E384A;
--winter-frost-22: #19303E;
--winter-frost-23: #142832;
--winter-frost-24: #0F2026;
--winter-frost-25: #C2C0DC;
--winter-frost-26: #ADAACE;
--winter-frost-27: #9894BE;
--winter-frost-28: #8480AC;
--winter-frost-29: #706C98;
--winter-frost-30: #5C5882;
}SCSS
$winter-frost-1: #EEF4F8;
$winter-frost-2: #DEE9F0;
$winter-frost-3: #CDDEE8;
$winter-frost-4: #BCD2E0;
$winter-frost-5: #A9C5D8;
$winter-frost-6: #96B8CF;
$winter-frost-7: #7FAAC8;
$winter-frost-8: #6E9CBE;
$winter-frost-9: #5D8EB2;
$winter-frost-10: #4D80A4;
$winter-frost-11: #3F7296;
$winter-frost-12: #336486;
$winter-frost-13: #D2D8DC;
$winter-frost-14: #BCC4CA;
$winter-frost-15: #A5AFB6;
$winter-frost-16: #8E99A1;
$winter-frost-17: #78838C;
$winter-frost-18: #636E77;
$winter-frost-19: #2A4866;
$winter-frost-20: #244058;
$winter-frost-21: #1E384A;
$winter-frost-22: #19303E;
$winter-frost-23: #142832;
$winter-frost-24: #0F2026;
$winter-frost-25: #C2C0DC;
$winter-frost-26: #ADAACE;
$winter-frost-27: #9894BE;
$winter-frost-28: #8480AC;
$winter-frost-29: #706C98;
$winter-frost-30: #5C5882;Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'winter-frost': {
'1': '#EEF4F8',
'2': '#DEE9F0',
'3': '#CDDEE8',
'4': '#BCD2E0',
'5': '#A9C5D8',
'6': '#96B8CF',
'7': '#7FAAC8',
'8': '#6E9CBE',
'9': '#5D8EB2',
'10': '#4D80A4',
'11': '#3F7296',
'12': '#336486',
'13': '#D2D8DC',
'14': '#BCC4CA',
'15': '#A5AFB6',
'16': '#8E99A1',
'17': '#78838C',
'18': '#636E77',
'19': '#2A4866',
'20': '#244058',
'21': '#1E384A',
'22': '#19303E',
'23': '#142832',
'24': '#0F2026',
'25': '#C2C0DC',
'26': '#ADAACE',
'27': '#9894BE',
'28': '#8480AC',
'29': '#706C98',
'30': '#5C5882',
},
},
},
},
};JSON
{
"name": "Winter Frost",
"colors": [
"#EEF4F8",
"#DEE9F0",
"#CDDEE8",
"#BCD2E0",
"#A9C5D8",
"#96B8CF",
"#7FAAC8",
"#6E9CBE",
"#5D8EB2",
"#4D80A4",
"#3F7296",
"#336486",
"#D2D8DC",
"#BCC4CA",
"#A5AFB6",
"#8E99A1",
"#78838C",
"#636E77",
"#2A4866",
"#244058",
"#1E384A",
"#19303E",
"#142832",
"#0F2026",
"#C2C0DC",
"#ADAACE",
"#9894BE",
"#8480AC",
"#706C98",
"#5C5882"
]
}Hex list
#EEF4F8
#DEE9F0
#CDDEE8
#BCD2E0
#A9C5D8
#96B8CF
#7FAAC8
#6E9CBE
#5D8EB2
#4D80A4
#3F7296
#336486
#D2D8DC
#BCC4CA
#A5AFB6
#8E99A1
#78838C
#636E77
#2A4866
#244058
#1E384A
#19303E
#142832
#0F2026
#C2C0DC
#ADAACE
#9894BE
#8480AC
#706C98
#5C5882