What are the hex codes in the Peacock & Pewter Echo palette?

The Peacock & Pewter Echo color palette consists of Ice #D3E7F1, Pewter #7996A6, Peacock #00515E, Obsidian #01151A.

How should I use the Peacock & Pewter Echo palette on a website?

Use Ice #D3E7F1 as the background, Obsidian #01151A for text, Peacock #00515E for buttons and links, and Pewter #7996A6 for accents. 3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Ice on Obsidian at 14.66:1.

Which colors in Peacock & Pewter Echo have enough contrast for text?

The highest-contrast pair is #D3E7F1 on #01151A with a ratio of 14.66:1, which passes WCAG AA for normal text.

#D3E7F1Ice

#7996A6Pewter

#00515EPeacock

#01151AObsidian

Peacock & Pewter Echo color palette

Dark Muted Minimal Gray Black

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Ice	`#D3E7F1`	`rgb(211, 231, 241)`	`hsl(200, 52%, 89%)`	`oklch(91.6% 0.025 229)`
Pewter	`#7996A6`	`rgb(121, 150, 166)`	`hsl(201, 20%, 56%)`	`oklch(65.7% 0.040 232)`
Peacock	`#00515E`	`rgb(0, 81, 94)`	`hsl(188, 100%, 18%)`	`oklch(40.0% 0.070 213)`
Obsidian	`#01151A`	`rgb(1, 21, 26)`	`hsl(192, 93%, 5%)`	`oklch(18.1% 0.030 215)`

Why it works and how to use it

Peacock & Pewter Echo is a vivid monochromatic color palette tagged dark, muted, minimal. All four colors sit within 13° of hue, so the scheme reads as one color explored across light and dark. These are bold, punchy colors that need generous white space around them. The overall temperature is cool.

With 3 chromatic colors, Peacock takes the lead while the rest support. Lightness runs from 5% to 89%. Well suited to websites, presentations and branding.

Background: Ice (#D3E7F1) is the lightest color, so it belongs on large surfaces.
Text: Obsidian (#01151A) on #D3E7F1 gives 14.66:1, passing WCAG AAA.
Primary: Peacock (#00515E) is the most saturated mid-tone; use it for buttons and links (7.04:1 against the background, fine for UI elements).
Accent: Pewter (#7996A6) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Ice on Obsidian at 14.66:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Peacock & Pewter Echo

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

Roles are assigned by lightness.

Color blindness simulation

#D3E7F1

#7996A6

#00515E

#01151A

Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.

Palette card

Contrast check WCAG ratios between palette colors

Pair	Sample	Ratio	Level
`#D3E7F1` on `#01151A`	Aa	14.66:1	AAA
`#D3E7F1` on `#00515E`	Aa	7.04:1	AAA
`#7996A6` on `#01151A`	Aa	5.99:1	AA
`#7996A6` on `#00515E`	Aa	2.88:1	Fail
`#D3E7F1` on `#7996A6`	Aa	2.45:1	Fail
`#00515E` on `#01151A`	Aa	2.08:1	Fail

Similar palettes 24 more in this mood