coolpastel
Mint Chip Color Palette
Mint Chip is a cool and pastel color palette of 5 colors: Gunmetal (#2b2d42), Cool Grey (#8d99ae), Eggshell (#d8f3dc), Celadon (#95d5b2) and Mint (#52b788). Its dominant hue is green.
The darkest color, Gunmetal, on the lightest, Eggshell, gives a 11.41:1 contrast ratio — enough for body text at WCAG AAA. 4 pairs in this palette pass AA for normal text. Mint (#52b788) is its most saturated color and a natural choice for buttons and links.
Colors
- Gunmetal
- Cool Grey
- Eggshell
- Celadon
- Mint
CSS Output
:root {
--mint-chip-1: #2b2d42;
--mint-chip-2: #8d99ae;
--mint-chip-3: #d8f3dc;
--mint-chip-4: #95d5b2;
--mint-chip-5: #52b788;
}Mint Chip on a Website
A quick preview on a landing page: the most colorful colors become the primary and accent, a light one the surface. For a more realistic look across many designs, open it in the Palette Visualizer below.
See it on real designs
This is a single preview. The Palette Visualizer shows the palette on 11 designs — dashboards, mobile apps, pricing and blog pages, posters and business cards — lets you change which color plays which role, switch to dark mode and check contrast.
Accessible Color Combinations
Pairs from this palette that work as text on a background, with their WCAG contrast ratio. AA needs 4.5:1 for body text; large text needs 3:1.
- Gunmetal on Eggshell#2b2d42 on #d8f3dc11.41:1AAA
- Gunmetal on Celadon#2b2d42 on #95d5b27.99:1AAA
- Gunmetal on Mint#2b2d42 on #52b7885.45:1AA
- Gunmetal on Cool Grey#2b2d42 on #8d99ae4.68:1AA