What are the hex codes in the Sky Blue & Slate Mood palette?

The Sky Blue & Slate Mood color palette consists of Slate #5E8B86, Ash #A7C4BC, Sky Blue #85BAE2, Linen #F6F0E6.

How should I use the Sky Blue & Slate Mood palette on a website?

Use Linen #F6F0E6 as the background, Slate #5E8B86 for text, Sky Blue #85BAE2 for buttons and links, and Ash #A7C4BC for accents. No pair inside the palette reaches 4.5:1, so add black or white for body text.

Which colors in Sky Blue & Slate Mood have enough contrast for text?

The highest-contrast pair is #5E8B86 on #F6F0E6 with a ratio of 3.36:1, which passes WCAG AA for large text only.

#5E8B86Slate

#A7C4BCAsh

#85BAE2Sky Blue

#F6F0E6Linen

Sky Blue & Slate Mood color palette

Muted Gray Blue White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Slate	`#5E8B86`	`rgb(94, 139, 134)`	`hsl(173, 19%, 46%)`	`oklch(60.3% 0.050 187)`
Ash	`#A7C4BC`	`rgb(167, 196, 188)`	`hsl(163, 20%, 71%)`	`oklch(79.6% 0.033 177)`
Sky Blue	`#85BAE2`	`rgb(133, 186, 226)`	`hsl(206, 62%, 70%)`	`oklch(76.7% 0.080 242)`
Linen	`#F6F0E6`	`rgb(246, 240, 230)`	`hsl(37, 47%, 93%)`	`oklch(95.7% 0.015 81)`

Why it works and how to use it

Sky Blue & Slate Mood is a complementary color palette tagged muted, gray, blue. Slate and Linen sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

With 4 chromatic colors, Sky Blue takes the lead while the rest support. Lightness runs from 46% to 93%. Well suited to websites, presentations and branding.

Background: Linen (#F6F0E6) is the lightest color, so it belongs on large surfaces.
Text: Slate (#5E8B86) on #F6F0E6 gives 3.36:1, enough for large headings only.
Primary: Sky Blue (#85BAE2) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Ash (#A7C4BC) for highlights, badges and hover states.

No pair inside the palette reaches 4.5:1, so add black or white for body text.

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

BrandFeaturesPricingBlogGet started

Design faster with Sky Blue & Slate Mood

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

#5E8B86

#A7C4BC

#85BAE2

#F6F0E6

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
`#5E8B86` on `#F6F0E6`	Aa	3.36:1	AA large only
`#5E8B86` on `#A7C4BC`	Aa	2.04:1	Fail
`#5E8B86` on `#85BAE2`	Aa	1.84:1	Fail
`#85BAE2` on `#F6F0E6`	Aa	1.83:1	Fail
`#A7C4BC` on `#F6F0E6`	Aa	1.64:1	Fail
`#A7C4BC` on `#85BAE2`	Aa	1.11:1	Fail

Similar palettes 24 more in this mood