#3C5148
#7A9B76
#C8D5B9
#F6F5EE
#EAF7EFSmoke
#BFE8D2Glacier
#F9E1C4Bisque
#4A6B5AStorm
Mint Macaron is a pastel light, split color palette tagged muted, white, beige. The hues span about 116°, enough contrast to create a focal point without the harshness of true complements. The colors are light and airy, which suits friendly, soft-spoken brands.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Smoke | #EAF7EF | rgb(234, 247, 239) | hsl(143, 45%, 94%) | oklch(96.4% 0.017 159) | |
| Glacier | #BFE8D2 | rgb(191, 232, 210) | hsl(148, 47%, 83%) | oklch(89.6% 0.052 162) | |
| Bisque | #F9E1C4 | rgb(249, 225, 196) | hsl(33, 82%, 87%) | oklch(92.2% 0.047 72) | |
| Storm | #4A6B5A | rgb(74, 107, 90) | hsl(149, 18%, 35%) | oklch(49.7% 0.047 162) |
Why it works and how to use it
With 4 chromatic colors, Bisque takes the lead while the rest support. Lightness runs from 35% to 94%. Well suited to social media templates and gentle interfaces.
- Background: Smoke (#EAF7EF) is the lightest color, so it belongs on large surfaces.
- Text: Storm (#4A6B5A) on #EAF7EF gives 5.38:1, passing WCAG AA.
- Primary: Bisque (#F9E1C4) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Glacier (#BFE8D2) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Smoke on Storm at 5.38:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Mint Macaron
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#EAF7EF
#BFE8D2
#F9E1C4
#4A6B5A
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#EAF7EF on #4A6B5A | Aa | 5.38:1 | AA |
#F9E1C4 on #4A6B5A | Aa | 4.69:1 | AA |
#BFE8D2 on #4A6B5A | Aa | 4.43:1 | AA large only |
#EAF7EF on #BFE8D2 | Aa | 1.21:1 | Fail |
#EAF7EF on #F9E1C4 | Aa | 1.15:1 | Fail |
#BFE8D2 on #F9E1C4 | Aa | 1.06:1 | Fail |
Similar palettes 24 more in this mood
#006D77
#83C5BE
#EDF6F9
#FFDDD2
#7D6E5D
#B9A990
#E7DFD3
#F9F7F3
#FFF4F6
#FFC9D6
#FFE7A8
#7A5C6B
#5E8B86
#A7C4BC
#D9A87E
#F6F0E6
#452700
#686265
#FFB9A3
#FFEAEC
#C1D7C4
#BBF0F9
#E5F1BF
#F0FBF8
#FBF6F0
#F3DCD4
#E8B4B8
#B8A184
#FBF7EF
#EAD9B8
#C9A961
#3A3226
#142532
#528494
#DE9D89
#FAF4E9
#F9EDEA
#E8C4B8
#B76E79
#4A3F3C
#1D1900
#B0BEB3
#D5EBBA
#FFF2E0
#586557
#96856F
#E3D0B5
#FFFAEF
#3E4551
#677287
#EDF3FE
#FFE2A8
#69849E
#A9C0CF
#ACBB81
#F6F0E6
#3B4A3E
#728C69
#D3E0C3
#FCFAF3
#D198A5
#E0B289
#CDBAC8
#FFEBE6
#FFF4F0
#FFD6C1
#A39078
#67635D
#433D37
#AE9E8D
#FFD0C3
#FFEEE7
#B89F6E
#DAC9A1
#6A6A5A
#F5F3EE
#F0CFAE
#BAA889
#FFEEE2
#918C84
#FFF4E2
#FFE0AB
#D6C8AE
#AFABA3
#BBA77C
#CFC2A5
#898A78
#F0EEE6
#F3EBDD
#DCCFB8
#436449
#1C2A20