What are the hex codes in the Bold Ice & Slate palette?

The Bold Ice & Slate color palette consists of Onyx #373A3D, Slate #717780, Ice #C1FFE1, Frost #EBEFF3.

How should I use the Bold Ice & Slate palette on a website?

Use Ice #C1FFE1 as the background, Onyx #373A3D for text, Frost #EBEFF3 for buttons and links, and Slate #717780 for accents. 2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Onyx on Ice at 10.17:1.

Which colors in Bold Ice & Slate have enough contrast for text?

The highest-contrast pair is #373A3D on #C1FFE1 with a ratio of 10.17:1, which passes WCAG AA for normal text.

#373A3DOnyx

#717780Slate

#C1FFE1Ice

#EBEFF3Frost

Bold Ice & Slate color palette

Tech Minimal Gray White

Color codes click any value to copy

Name	HEX	RGB	HSL	OKLCH
Onyx	`#373A3D`	`rgb(55, 58, 61)`	`hsl(210, 5%, 23%)`	`oklch(34.7% 0.007 248)`
Slate	`#717780`	`rgb(113, 119, 128)`	`hsl(216, 6%, 47%)`	`oklch(56.7% 0.016 258)`
Ice	`#C1FFE1`	`rgb(193, 255, 225)`	`hsl(151, 100%, 88%)`	`oklch(95.0% 0.074 164)`
Frost	`#EBEFF3`	`rgb(235, 239, 243)`	`hsl(210, 25%, 94%)`	`oklch(95.0% 0.007 248)`

Why it works and how to use it

Bold Ice & Slate is an analogous color palette tagged tech, minimal, gray. Analogous neighbors on the wheel (Ice, Frost) give it a natural, low-tension flow. Saturation is moderate, which keeps it flexible for both interfaces and print. The overall temperature is cool.

The palette holds together thanks to its analogous hue relationship and a strong light-to-dark ladder (94% down to 23% lightness). A natural fit for a SaaS landing page or dashboard.

Background: Ice (#C1FFE1) is the lightest color, so it belongs on large surfaces.
Text: Onyx (#373A3D) on #C1FFE1 gives 10.17:1, passing WCAG AAA.
Primary: Frost (#EBEFF3) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
Accent: Slate (#717780) for highlights, badges and hover states.

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

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

BrandFeaturesPricingBlogGet started

Design faster with Bold Ice & Slate

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

#373A3D

#717780

#C1FFE1

#EBEFF3

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
`#373A3D` on `#C1FFE1`	Aa	10.17:1	AAA
`#373A3D` on `#EBEFF3`	Aa	9.9:1	AAA
`#717780` on `#C1FFE1`	Aa	4.01:1	AA large only
`#717780` on `#EBEFF3`	Aa	3.91:1	AA large only
`#373A3D` on `#717780`	Aa	2.54:1	Fail
`#C1FFE1` on `#EBEFF3`	Aa	1.03:1	Fail

Similar palettes 24 more in this mood