Spring Color Palette
Cherry blossom, daffodil, fresh leaves, robin egg blue and lilac. Spring colors are light, cheerful and full of new beginnings.
Click any color to copy its HEX code.
Spring color codes
| Name | HEX | RGB | HSL | |
|---|---|---|---|---|
| Cloud | #FAF7F2 | 250, 247, 242 | 38°, 44%, 96% | |
| Cherry Blossom | #F6C6D0 | 246, 198, 208 | 348°, 73%, 87% | |
| Daffodil | #F9E27D | 249, 226, 125 | 49°, 91%, 73% | |
| Fresh Leaf | #9ED27E | 158, 210, 126 | 97°, 48%, 66% | |
| Robin Egg | #A7D8E8 | 167, 216, 232 | 195°, 59%, 78% | |
| Lilac | #C8A8E0 | 200, 168, 224 | 274°, 47%, 77% |
How to use this palette
A simple way to use 6 colors without chaos is the 60-30-10 rule: about 60% of the space in the lightest shade, 30% in a supporting color and 10% in the accent. For this palette that is Cloud (#FAF7F2) as the base, Cherry Blossom (#F6C6D0) as the supporting color and Daffodil (#F9E27D) as the accent, with Lilac (#C8A8E0) for text and fine details.
Spring
A quick preview of the palette with base, text and accent colors.
Daffodil Cherry BlossomWhere it works
Readable text color pairs
None of the pairs in this palette reach the 4.5:1 contrast needed for small text. Use near-black (#1B1A17) or white text on these colors, and keep the palette for backgrounds, shapes and decoration.
CSS variables
:root {
--cloud: #FAF7F2;
--cherry-blossom: #F6C6D0;
--daffodil: #F9E27D;
--fresh-leaf: #9ED27E;
--robin-egg: #A7D8E8;
--lilac: #C8A8E0;
}