What are the hex codes in the Deep Cadet & Peacock palette?

The Deep Cadet & Peacock color palette consists of Licorice #06141B, Peacock #315B70, Cadet #00A3BA, Ash #9EC6CE.

How should I use the Deep Cadet & Peacock palette on a website?

Use Ash #9EC6CE as the background, Licorice #06141B for text, Cadet #00A3BA for buttons and links, and Peacock #315B70 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Licorice on Ash at 10.17:1.

Which colors in Deep Cadet & Peacock have enough contrast for text?

The highest-contrast pair is #06141B on #9EC6CE with a ratio of 10.17:1, which passes WCAG AA for normal text.

#06141BLicorice

#315B70Peacock

#00A3BACadet

#9EC6CEAsh

Deep Cadet & Peacock color palette

Dark Cold Minimal Black Teal

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Licorice	`#06141B`	`rgb(6, 20, 27)`	`hsl(200, 64%, 6%)`	`oklch(18.2% 0.025 231)`
Peacock	`#315B70`	`rgb(49, 91, 112)`	`hsl(200, 39%, 32%)`	`oklch(45.0% 0.058 232)`
Cadet	`#00A3BA`	`rgb(0, 163, 186)`	`hsl(187, 100%, 36%)`	`oklch(65.7% 0.115 212)`
Ash	`#9EC6CE`	`rgb(158, 198, 206)`	`hsl(190, 33%, 71%)`	`oklch(80.0% 0.044 211)`

Why it works and how to use it

Deep Cadet & Peacock is a dark, monochromatic color palette tagged dark, cold, minimal. A monochromatic set: the same hue family from Licorice down to Ash. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is cool.

With 3 chromatic colors, Cadet takes the lead while the rest support. Lightness runs from 6% to 71%. Well suited to dark-mode interfaces and gaming.

Background: Ash (#9EC6CE) is the lightest color, so it belongs on large surfaces.
Text: Licorice (#06141B) on #9EC6CE gives 10.17:1, passing WCAG AAA.
Primary: Cadet (#00A3BA) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Peacock (#315B70) for highlights, badges and hover states.

2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Licorice on Ash at 10.17:1.

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

BrandFeaturesPricingBlogGet started

Design faster with Deep Cadet & Peacock

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

#06141B

#315B70

#00A3BA

#9EC6CE

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
`#06141B` on `#9EC6CE`	Aa	10.17:1	AAA
`#06141B` on `#00A3BA`	Aa	6.18:1	AA
`#315B70` on `#9EC6CE`	Aa	3.99:1	AA large only
`#06141B` on `#315B70`	Aa	2.55:1	Fail
`#315B70` on `#00A3BA`	Aa	2.43:1	Fail
`#00A3BA` on `#9EC6CE`	Aa	1.64:1	Fail

Similar palettes 24 more in this mood