Sage Garden
Sage greens with warm gold for garden ceremonies.
Color codes
| HEX | RGB | HSL | CMYK | |
|---|---|---|---|---|
| hsl(43, 26%, 95%) | cmyk(0%, 1%, 3%, 4%) | |||
| hsl(75, 22%, 86%) | cmyk(2%, 0%, 7%, 11%) | |||
| hsl(82, 19%, 69%) | cmyk(6%, 0%, 16%, 25%) | |||
| hsl(86, 14%, 48%) | cmyk(11%, 0%, 24%, 45%) | |||
| hsl(35, 40%, 64%) | cmyk(0%, 16%, 37%, 22%) |
CSS
:root {
--sage-garden-1: #F5F3EE;
--sage-garden-2: #DFE3D3;
--sage-garden-3: #B5C0A2;
--sage-garden-4: #7D8C6A;
--sage-garden-5: #C8A97E;
}
How these colors work together
The colors are analogous — neighbors on the color wheel — which gives a calm, cohesive feel. Overall it reads warm. Lightness spans 46 points, which sets how much contrast you can create.
0 of 10 color pairs reach the 4.5:1 contrast needed for normal text. The most readable pair is #F5F3EE on #7D8C6A (3.25:1).
Sage Garden — readable text using the best pair.
Suggested applications
- Invitations, decor and event branding.
- Interface themes: use the lightest color for backgrounds and the darkest for text.
- Brand kits, social graphics and presentations.
Frequently asked questions
How do I use the Sage Garden palette?
The Sage Garden palette has 5 colors. Use one dominant color for large areas, a supporting color for secondary elements and the most saturated color sparingly as an accent.
Which colors in this palette are best for text?
Use #F5F3EE on #7D8C6A: it has a contrast ratio of 3.25:1.
Can I download this palette?
Yes. Export it as PNG, SVG, CSS variables, JSON or plain text with the buttons above the color table.
More palettes
Dusty Blue Ceremony#F4F6F8 #CFD9E2 #9FB3C8 #61789A #D6B88FBurgundy Autumn#4A0E1C #7B1E33 #B5524F #E8B78F #F7ECDFBlush and Ivory#FFFAF3 #F6E3DC #E8C2B8 #C99A8E #8A5A52Retro Diner#E63946 #F1FAEE #A8DADC #457B9D #1D3557Velvet Night#1A0F1F #3D1E4A #6B2D5C #A8456F #E7C6A5Lavender Fields#F3EEFC #E0D4F7 #C3B1E1 #9D8EC7 #6A5D8F