Digital Calm

Cool, low-stress blues and lilacs for trustworthy interfaces.

Fintech & SaaS

About the Digital Calm palette

Digital Calm answers screen fatigue with a palette of icy blues, soft slates, and lilac mists. Low in saturation and gentle on the eyes, it reads as composed, clean, and reassuring — the visual language of products that want to feel safe, modern, and effortlessly professional.

Where to use Digital Calm

A natural fit for fintech, SaaS dashboards, productivity tools, and healthcare UI. Use Pearl Grey and Ice Blue for surfaces, Slate for secondary type, and Lilac Mist as a quiet accent for states and highlights.

Colors in the Digital Calm palette

Ice Blue base

HEX

#D8E8F0

RGB

rgb(216, 232, 240)

HSL

hsl(200, 44%, 89%)

OKLCH

oklch(0.9214 0.0203 229.05)
Storm Blue surface

HEX

#B8CDD8

RGB

rgb(184, 205, 216)

HSL

hsl(201, 29%, 78%)

OKLCH

oklch(0.8359 0.0275 230.42)
Slate support

HEX

#A8B8CC

RGB

rgb(168, 184, 204)

HSL

hsl(213, 26%, 73%)

OKLCH

oklch(0.7767 0.0337 254.04)
Lilac Mist accent

HEX

#C8C0D8

RGB

rgb(200, 192, 216)

HSL

hsl(260, 24%, 80%)

OKLCH

oklch(0.8217 0.0343 300.82)
Pearl Grey surface

HEX

#DED8E8

RGB

rgb(222, 216, 232)

HSL

hsl(263, 26%, 88%)

OKLCH

oklch(0.8917 0.0226 302.9)

Text contrast on the Ice Blue base

On the Ice Blue base (#D8E8F0), black text reads best, scoring a WCAG contrast ratio of 16.72:1. Use it for body copy and pair the palette's deeper tones for headings and accents.

Digital Calm Body text on Ice Blue — black at 16.72:1

Copy the Digital Calm palette

CSS custom properties

:root {
	--color-1: #D8E8F0;
	--color-2: #B8CDD8;
	--color-3: #A8B8CC;
	--color-4: #C8C0D8;
	--color-5: #DED8E8;
}

JSON

{ "colors": [
  { "hex": "#D8E8F0", "rgb": "rgb(216, 232, 240)", "hsl": "hsl(200, 44%, 89%)", "oklch": "oklch(0.9214 0.0203 229.05)" },
  { "hex": "#B8CDD8", "rgb": "rgb(184, 205, 216)", "hsl": "hsl(201, 29%, 78%)", "oklch": "oklch(0.8359 0.0275 230.42)" },
  { "hex": "#A8B8CC", "rgb": "rgb(168, 184, 204)", "hsl": "hsl(213, 26%, 73%)", "oklch": "oklch(0.7767 0.0337 254.04)" },
  { "hex": "#C8C0D8", "rgb": "rgb(200, 192, 216)", "hsl": "hsl(260, 24%, 80%)", "oklch": "oklch(0.8217 0.0343 300.82)" },
  { "hex": "#DED8E8", "rgb": "rgb(222, 216, 232)", "hsl": "hsl(263, 26%, 88%)", "oklch": "oklch(0.8917 0.0226 302.9)" }
] }

Frequently asked questions

What is the Digital Calm palette?: Digital Calm answers screen fatigue with a palette of icy blues, soft slates, and lilac mists. Low in saturation and gentle on the eyes, it reads as composed, clean, and reassuring — the visual language of products that want to feel safe, modern, and effortlessly professional.
What hex codes are in the Digital Calm palette?: The Digital Calm palette uses 5 colors: Ice Blue #D8E8F0, Storm Blue #B8CDD8, Slate #A8B8CC, Lilac Mist #C8C0D8, Pearl Grey #DED8E8.

All 2026 trend palettes