Peachy Sunrise Color Palette
The first light of morning: pale gold and peach warming into apricot and coral, soft rose, and a lavender-into-blue dawn sky. Gentler and pinker than a sunset, all low-saturation glow rather than fire. For sunrise skies, soft gradients, and tender morning scenes.
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 {
--peachy-sunrise-1: #FBEFD2;
--peachy-sunrise-2: #F9E6BE;
--peachy-sunrise-3: #F6DCAA;
--peachy-sunrise-4: #F2D196;
--peachy-sunrise-5: #EDC684;
--peachy-sunrise-6: #E7BA73;
--peachy-sunrise-7: #FBD3A8;
--peachy-sunrise-8: #F8C295;
--peachy-sunrise-9: #F4B184;
--peachy-sunrise-10: #EEA074;
--peachy-sunrise-11: #E69066;
--peachy-sunrise-12: #DC8159;
--peachy-sunrise-13: #F5A6A0;
--peachy-sunrise-14: #EF958F;
--peachy-sunrise-15: #E7847F;
--peachy-sunrise-16: #DD7470;
--peachy-sunrise-17: #D16562;
--peachy-sunrise-18: #C25656;
--peachy-sunrise-19: #E68FA0;
--peachy-sunrise-20: #DC7E92;
--peachy-sunrise-21: #D06E85;
--peachy-sunrise-22: #C25F78;
--peachy-sunrise-23: #B2516C;
--peachy-sunrise-24: #A14460;
--peachy-sunrise-25: #C9B0D2;
--peachy-sunrise-26: #B6A0C8;
--peachy-sunrise-27: #A492BE;
--peachy-sunrise-28: #9E9CCB;
--peachy-sunrise-29: #9AA8D4;
--peachy-sunrise-30: #9AB6DC;
}SCSS
$peachy-sunrise-1: #FBEFD2;
$peachy-sunrise-2: #F9E6BE;
$peachy-sunrise-3: #F6DCAA;
$peachy-sunrise-4: #F2D196;
$peachy-sunrise-5: #EDC684;
$peachy-sunrise-6: #E7BA73;
$peachy-sunrise-7: #FBD3A8;
$peachy-sunrise-8: #F8C295;
$peachy-sunrise-9: #F4B184;
$peachy-sunrise-10: #EEA074;
$peachy-sunrise-11: #E69066;
$peachy-sunrise-12: #DC8159;
$peachy-sunrise-13: #F5A6A0;
$peachy-sunrise-14: #EF958F;
$peachy-sunrise-15: #E7847F;
$peachy-sunrise-16: #DD7470;
$peachy-sunrise-17: #D16562;
$peachy-sunrise-18: #C25656;
$peachy-sunrise-19: #E68FA0;
$peachy-sunrise-20: #DC7E92;
$peachy-sunrise-21: #D06E85;
$peachy-sunrise-22: #C25F78;
$peachy-sunrise-23: #B2516C;
$peachy-sunrise-24: #A14460;
$peachy-sunrise-25: #C9B0D2;
$peachy-sunrise-26: #B6A0C8;
$peachy-sunrise-27: #A492BE;
$peachy-sunrise-28: #9E9CCB;
$peachy-sunrise-29: #9AA8D4;
$peachy-sunrise-30: #9AB6DC;Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'peachy-sunrise': {
'1': '#FBEFD2',
'2': '#F9E6BE',
'3': '#F6DCAA',
'4': '#F2D196',
'5': '#EDC684',
'6': '#E7BA73',
'7': '#FBD3A8',
'8': '#F8C295',
'9': '#F4B184',
'10': '#EEA074',
'11': '#E69066',
'12': '#DC8159',
'13': '#F5A6A0',
'14': '#EF958F',
'15': '#E7847F',
'16': '#DD7470',
'17': '#D16562',
'18': '#C25656',
'19': '#E68FA0',
'20': '#DC7E92',
'21': '#D06E85',
'22': '#C25F78',
'23': '#B2516C',
'24': '#A14460',
'25': '#C9B0D2',
'26': '#B6A0C8',
'27': '#A492BE',
'28': '#9E9CCB',
'29': '#9AA8D4',
'30': '#9AB6DC',
},
},
},
},
};JSON
{
"name": "Peachy Sunrise",
"colors": [
"#FBEFD2",
"#F9E6BE",
"#F6DCAA",
"#F2D196",
"#EDC684",
"#E7BA73",
"#FBD3A8",
"#F8C295",
"#F4B184",
"#EEA074",
"#E69066",
"#DC8159",
"#F5A6A0",
"#EF958F",
"#E7847F",
"#DD7470",
"#D16562",
"#C25656",
"#E68FA0",
"#DC7E92",
"#D06E85",
"#C25F78",
"#B2516C",
"#A14460",
"#C9B0D2",
"#B6A0C8",
"#A492BE",
"#9E9CCB",
"#9AA8D4",
"#9AB6DC"
]
}Hex list
#FBEFD2
#F9E6BE
#F6DCAA
#F2D196
#EDC684
#E7BA73
#FBD3A8
#F8C295
#F4B184
#EEA074
#E69066
#DC8159
#F5A6A0
#EF958F
#E7847F
#DD7470
#D16562
#C25656
#E68FA0
#DC7E92
#D06E85
#C25F78
#B2516C
#A14460
#C9B0D2
#B6A0C8
#A492BE
#9E9CCB
#9AA8D4
#9AB6DC