#EEF9F7Smoke
#BCE7E0Glacier
#85CFC5Sky Blue
#2F5F5ASpruce

Seafoam Whisper color palette

Color codes click any value to copy

SwatchNameHEXRGBHSLOKLCH
Smoke#EEF9F7rgb(238, 249, 247)hsl(169, 48%, 95%)oklch(97.3% 0.012 184)
Glacier#BCE7E0rgb(188, 231, 224)hsl(170, 47%, 82%)oklch(89.6% 0.046 184)
Sky Blue#85CFC5rgb(133, 207, 197)hsl(172, 44%, 67%)oklch(80.3% 0.075 185)
Spruce#2F5F5Argb(47, 95, 90)hsl(174, 34%, 28%)oklch(45.0% 0.053 187)

Why it works and how to use it

Seafoam Whisper is a monochromatic color palette tagged muted, cold, minimal. A monochromatic set: the same hue family from Spruce down to Smoke. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is cool.

With 3 chromatic colors, Glacier takes the lead while the rest support. Lightness runs from 28% to 95%. Well suited to websites, presentations and branding.

  • Background: Smoke (#EEF9F7) is the lightest color, so it belongs on large surfaces.
  • Text: Spruce (#2F5F5A) on #EEF9F7 gives 6.72:1, passing WCAG AA.
  • Primary: Glacier (#BCE7E0) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
  • Accent: Sky Blue (#85CFC5) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Smoke on Spruce at 6.72:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Seafoam Whisper

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary
Card title
Card title
Card title
Roles are assigned by lightness.

Color blindness simulation

#EEF9F7
#BCE7E0
#85CFC5
#2F5F5A

Color-blind check: under protanopia and deuteranopia, Smoke and Glacier become hard to tell apart, so do not rely on that pair alone to carry meaning.

Palette card

Seafoam Whisper color palette card: Smoke #EEF9F7, Glacier #BCE7E0, Sky Blue #85CFC5, Spruce #2F5F5A
Save or share Seafoam Whisper as an image with its hex codes.

Contrast check WCAG ratios between palette colors

PairSampleRatioLevel
#EEF9F7 on #2F5F5AAa6.72:1AA
#BCE7E0 on #2F5F5AAa5.38:1AA
#85CFC5 on #2F5F5AAa4.04:1AA large only
#EEF9F7 on #85CFC5Aa1.67:1Fail
#BCE7E0 on #85CFC5Aa1.33:1Fail
#EEF9F7 on #BCE7E0Aa1.25:1Fail

Similar palettes 24 more in this mood