Garden Party
First screensFirst screens for a spring event or garden brand where the page should feel like an invitation before it informs.
Click a swatch to copy its hex.
Do not use this for
Dense dashboards. The romance leaves no quiet corner for data and the deep step is too loud for body text.
What was measured
- Closest neighbours
- ΔE00 22.7
- how alike two adjacent swatches look
- Darkest to lightest
- 7.06:1
- WCAG contrast across the set
- Lightness covered
- 62 pts
- of OKLCH lightness, 0–100
- Under colour blindness
- ΔE00 9.3
- worst under protanopia
These two are one colour to a reader with protanopia. Fine while the set is read as an order; never use them to mean two different things without a label or an icon as well.
A suggested mapping · derived, then measured
Five colours are not an interface, so this is an offer rather than a token set. It does not clear WCAG AA on secondary text — stated here rather than left for you to discover.
/* Garden Party — First screens for a spring event or garden brand where the page should feel like an invitation before it informs. */ :root
Tailwind
// tailwind.config — Garden Party
export default {
theme: {For your coding agent · printed from the colours
Use the Garden Party palette: #670045, #C8368F, #F8F0DA, #014C35, #73D4AC. It is for this: First screens for a spring event or garden brand where the page should feel like an invitation before it informs.
How this palette was built · no hex was chosen by hand
The catalog states a recipe — scene from hue 348 and 165 — and the five colours are derived from it in OKLCH, where a step of lightness is a step your eye agrees with rather than one the hex numbers agree with. That is why the numbers above are properties of this palette rather than claims about it.