Spring Blossom Color Palette
First-week-of-spring brightness: cherry-blossom pink, fresh new-leaf green, daffodil yellow, clear sky blue, and soft lilac. Cheerful and clean, each hue light and saturated like the garden waking up. For Easter and spring campaigns, floral illustration, and fresh, optimistic 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 {
--spring-blossom-1: #FBE0E8;
--spring-blossom-2: #F8CDD9;
--spring-blossom-3: #F3B8C8;
--spring-blossom-4: #ECA2B5;
--spring-blossom-5: #E28BA2;
--spring-blossom-6: #D5768F;
--spring-blossom-7: #DDF0C6;
--spring-blossom-8: #C8E7A6;
--spring-blossom-9: #B1DC85;
--spring-blossom-10: #98CE66;
--spring-blossom-11: #7FBD4B;
--spring-blossom-12: #67A636;
--spring-blossom-13: #FBEDA8;
--spring-blossom-14: #F7E086;
--spring-blossom-15: #F1D064;
--spring-blossom-16: #E7BC46;
--spring-blossom-17: #D7A532;
--spring-blossom-18: #C08E26;
--spring-blossom-19: #D2E8F4;
--spring-blossom-20: #B6D9EE;
--spring-blossom-21: #99CAE6;
--spring-blossom-22: #7CB8DC;
--spring-blossom-23: #62A6D0;
--spring-blossom-24: #4D93BE;
--spring-blossom-25: #E6DBF0;
--spring-blossom-26: #D6C5E8;
--spring-blossom-27: #C4ADDC;
--spring-blossom-28: #B095CE;
--spring-blossom-29: #9B7DBC;
--spring-blossom-30: #8567A6;
} SCSS
$spring-blossom-1: #FBE0E8;
$spring-blossom-2: #F8CDD9;
$spring-blossom-3: #F3B8C8;
$spring-blossom-4: #ECA2B5;
$spring-blossom-5: #E28BA2;
$spring-blossom-6: #D5768F;
$spring-blossom-7: #DDF0C6;
$spring-blossom-8: #C8E7A6;
$spring-blossom-9: #B1DC85;
$spring-blossom-10: #98CE66;
$spring-blossom-11: #7FBD4B;
$spring-blossom-12: #67A636;
$spring-blossom-13: #FBEDA8;
$spring-blossom-14: #F7E086;
$spring-blossom-15: #F1D064;
$spring-blossom-16: #E7BC46;
$spring-blossom-17: #D7A532;
$spring-blossom-18: #C08E26;
$spring-blossom-19: #D2E8F4;
$spring-blossom-20: #B6D9EE;
$spring-blossom-21: #99CAE6;
$spring-blossom-22: #7CB8DC;
$spring-blossom-23: #62A6D0;
$spring-blossom-24: #4D93BE;
$spring-blossom-25: #E6DBF0;
$spring-blossom-26: #D6C5E8;
$spring-blossom-27: #C4ADDC;
$spring-blossom-28: #B095CE;
$spring-blossom-29: #9B7DBC;
$spring-blossom-30: #8567A6; Tailwind
// tailwind.config.js
module.exports = {
theme: {
extend: {
colors: {
'spring-blossom': {
'1': '#FBE0E8',
'2': '#F8CDD9',
'3': '#F3B8C8',
'4': '#ECA2B5',
'5': '#E28BA2',
'6': '#D5768F',
'7': '#DDF0C6',
'8': '#C8E7A6',
'9': '#B1DC85',
'10': '#98CE66',
'11': '#7FBD4B',
'12': '#67A636',
'13': '#FBEDA8',
'14': '#F7E086',
'15': '#F1D064',
'16': '#E7BC46',
'17': '#D7A532',
'18': '#C08E26',
'19': '#D2E8F4',
'20': '#B6D9EE',
'21': '#99CAE6',
'22': '#7CB8DC',
'23': '#62A6D0',
'24': '#4D93BE',
'25': '#E6DBF0',
'26': '#D6C5E8',
'27': '#C4ADDC',
'28': '#B095CE',
'29': '#9B7DBC',
'30': '#8567A6',
},
},
},
},
}; JSON
{
"name": "Spring Blossom",
"colors": [
"#FBE0E8",
"#F8CDD9",
"#F3B8C8",
"#ECA2B5",
"#E28BA2",
"#D5768F",
"#DDF0C6",
"#C8E7A6",
"#B1DC85",
"#98CE66",
"#7FBD4B",
"#67A636",
"#FBEDA8",
"#F7E086",
"#F1D064",
"#E7BC46",
"#D7A532",
"#C08E26",
"#D2E8F4",
"#B6D9EE",
"#99CAE6",
"#7CB8DC",
"#62A6D0",
"#4D93BE",
"#E6DBF0",
"#D6C5E8",
"#C4ADDC",
"#B095CE",
"#9B7DBC",
"#8567A6"
]
} Hex list
#FBE0E8
#F8CDD9
#F3B8C8
#ECA2B5
#E28BA2
#D5768F
#DDF0C6
#C8E7A6
#B1DC85
#98CE66
#7FBD4B
#67A636
#FBEDA8
#F7E086
#F1D064
#E7BC46
#D7A532
#C08E26
#D2E8F4
#B6D9EE
#99CAE6
#7CB8DC
#62A6D0
#4D93BE
#E6DBF0
#D6C5E8
#C4ADDC
#B095CE
#9B7DBC
#8567A6