ColorSense Blog
Mint and Coral Refresh Color Palette (2026): HEX Codes and Accessible Dark Pairings
The Mint and Coral Refresh summer 2026 palette: five fresh HEX codes pairing cool mint and sage with warm coral and pink, plus measured WCAG AAA pairings and CSS.
Mint and Coral Refresh is the fresh palette of summer 2026: cool mint and sage balanced by warm coral and soft pink over a clean cream. It is part of our wider collection of 13 summer 2026 color palettes, and it is the one to reach for when you want a light, lively, hot-and-cold contrast.
The Mint and Coral Refresh palette: Minted, Sage Green, Muskmelon, Tickled Pink, and Cloud Dancer.
The 5 Colors in the Mint and Coral Refresh Palette
Minted #A8CFBA
A soft mint green and the cool heart of the palette. Light enough for large backgrounds, with a fresh, breezy feel.
Sage Green #8FAF7E
A muted leaf green that deepens the mint. Good for secondary surfaces, fills, and gentle accents rather than body text.
Muskmelon #F4A46A
A warm melon coral that brings the heat against the cool greens. Light enough for hero blocks with dark text and warm enough to drive an accent.
Tickled Pink #F2B8C6
A soft rose pink that lifts the coral. Gentle enough for backgrounds and warm enough for highlights, tags, and inviting accents.
Cloud Dancer #F4F1ED
A warm off-white cream and the lightest tone here. Use it as your primary page background or card surface.
Accessible Dark Pairings (WCAG AAA)
Mint and Coral Refresh is light and split between cool and warm, so accessibility means pairing each light tone with a deep anchor that matches its temperature. All three pairings below were calculated directly with the WCAG contrast formula and clear the AAA threshold of 7:1. Because contrast is symmetric, each ratio holds whether you use the light color as text on the dark tone or as a background behind dark text.
8.36:1 contrastAAA
Deep Pine
#14301E
7.56:1 contrastAAA
Deep Cacao
#3C1D06
8.66:1 contrastAAA
Deep Rose
#4B1528
A note on Sage Green #8FAF7E and Cloud Dancer #F4F1ED: Sage Green reaches 2.44:1 on white, so it works as a fill or accent rather than body text; Cloud Dancer is a near-neutral best kept as a light surface. For readable copy across the palette, set text in a deep anchor such as Deep Pine #14301E (14.27:1 on white) or a deep neutral like #1A1A1A (17.40:1 on white).
Try it now
Check any color pair against WCAG — free, no signup
Pick a foreground and background, see the exact contrast ratio plus AA/AAA verdicts for normal and large text. One click auto-fixes a failing pair while keeping your hue.
Open WCAG Contrast Checker →
How to Use Mint and Coral Refresh
Web and UI: use Cloud Dancer #F4F1ED as your page background, Minted #A8CFBA for cool surfaces, Muskmelon #F4A46A for warm hero blocks and accents, Tickled Pink for highlights and tags, and Sage Green for secondary fills. Keep body text in a deep anchor such as Deep Pine #14301E so it clears AAA.
Branding and print: the palette suits beauty and skincare, summer food and drink, wellness, and fresh lifestyle brands. Lead with mint and cream, then use coral and pink as warm focal accents.
Social and editorial: Mint and Coral Refresh pops behind fresh, summery photography — fruit, drinks, and clean flat lays. Pair Minted with Muskmelon for a lively hot-and-cold contrast.
Mint and Coral Refresh CSS Variables
Paste this straight into your stylesheet to use the palette as design tokens, including the accessible dark tones for text:
:root {
--minted: #A8CFBA;
--sage-green: #8FAF7E;
--muskmelon: #F4A46A;
--tickled-pink: #F2B8C6;
--cloud-dancer: #F4F1ED;
/* accessible dark tones for text and UI */
--deep-pine: #14301E;
--deep-cacao: #3C1D06;
--deep-rose: #4B1528;
}
Want this palette turned into a complete brand kit with matching fonts, contrast checks, and Tailwind and Figma tokens? Run it through the ColorSense Brand Kit, or pull a related set from your own image with the Color Picker.
Mint and Coral Refresh is one of 13 summer 2026 color palettes in our full guide. Browse the rest for pastels, brights, and earth tones.
Take it further
Turn any palette into a full brand kit
ColorSense AI Brand Kit pairs your palette with matching fonts, accessibility checks, and export-ready CSS, Tailwind, and Figma tokens.
Build a Brand Kit →