earthypastel
Matcha Latte Color Palette
Matcha Latte is a earthy and pastel color palette of 5 colors: Honey Dew (#f1faee), Khaki (#d4e09b), Dark Sea Green (#a3b18a), Fern (#588157) and Hunter Green (#3a5a40). Its dominant hue is green.
The darkest color, Hunter Green, on the lightest, Honey Dew, gives a 7.23:1 contrast ratio — enough for body text at WCAG AAA. 2 pairs in this palette pass AA for normal text. Khaki (#d4e09b) is its most saturated color and a natural choice for buttons and links.
Colors
- Honey Dew
- Khaki
- Dark Sea Green
- Fern
- Hunter Green
CSS Output
:root {
--matcha-latte-1: #f1faee;
--matcha-latte-2: #d4e09b;
--matcha-latte-3: #a3b18a;
--matcha-latte-4: #588157;
--matcha-latte-5: #3a5a40;
}Matcha Latte 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.
- Hunter Green on Honey Dew#3a5a40 on #f1faee7.23:1AAA
- Hunter Green on Khaki#3a5a40 on #d4e09b5.49:1AA
- Fern on Honey Dew#588157 on #f1faee4.18:1AA Large
- Hunter Green on Dark Sea Green#3a5a40 on #a3b18a3.39:1AA Large
- Fern on Khaki#588157 on #d4e09b3.18:1AA Large