Butter & Mint Noon
Pale sunlit warmth melting into cool mint and teal, like late afternoon light on garden leaves and still water.
Psychology
The dominant warm yellows create a gentle forward energy, while the cool greens and teals recede, establishing visual depth without tension. Low chroma across all eight colors produces serene cohesion, allowing the triadic structure to harmonize rather than vibrate, making this palette inherently calming despite its color diversity.
The warm-to-cool transition mirrors natural light cycles and plant growth, triggering associations with renewal and balance rather than drama or aggression.
The warm-to-cool transition mirrors natural light cycles and plant growth, triggering associations with renewal and balance rather than drama or aggression.
Usage
Ideal for organic skincare and wellness packaging, where soft pastels signal gentleness without clinical coldness, and editorial layouts for lifestyle and gardening publications that benefit from low-contrast sophistication. Interior design schemes for bedrooms, nurseries, and spa spaces leverage the palette's balanced calm and lightness to create restful environments without monotony.
Branding for farm-to-table restaurants and sustainable fashion lines can use these tones to communicate natural, approachable luxury through the palette's soft, unhurried character.
Branding for farm-to-table restaurants and sustainable fashion lines can use these tones to communicate natural, approachable luxury through the palette's soft, unhurried character.
Code
CSS Gradient
/* CSS gradient approximation of mesh gradient */
/* Note: This is a linear approximation. For the full animated mesh effect, use the React/JS export. */
background: linear-gradient(
90deg,
#cba16d 0%,
#dcc377 14%,
#e6eda8 29%,
#c3c66e 43%,
#9acf9d 57%,
#97efc2 71%,
#78ccb3 86%,
#70d4d3 100%
);Tailwind v4
/* app.css — Tailwind v4 */
@theme {
--color-gradient-1: #cba16d;
--color-gradient-2: #dcc377;
--color-gradient-3: #e6eda8;
--color-gradient-4: #c3c66e;
--color-gradient-5: #9acf9d;
--color-gradient-6: #97efc2;
--color-gradient-7: #78ccb3;
--color-gradient-8: #70d4d3;
}
/* Usage: bg-gradient-1, text-gradient-2, etc. */CSS Variables
--color-1: #cba16d; --color-2: #dcc377; --color-3: #e6eda8; --color-4: #c3c66e; --color-5: #9acf9d; --color-6: #97efc2; --color-7: #78ccb3; --color-8: #70d4d3;
Hex values
#cba16d, #dcc377, #e6eda8, #c3c66e, #9acf9d, #97efc2, #78ccb3, #70d4d3
Building something? Get this palette via the REST API.
History
Similar palettes
Frosted Meadow
Celadon Reverie
Linen Morning
Chalk Garden Bloom
Pastel Lagoon
Butter Meadow Soft
Moss Shallow Study
Misty Lagoon Hour
Orchard Harvest Rest
