← Back to Editor

#E8F3E1 · #C3E8D1 · #95BBC1 · #3D3B64 · #351B36

cool

A 5-color cool palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#E8F3E1

Celadon · Beige · Mint Green

HEX
#E8F3E1
RGB
rgb(232, 243, 225)
HSL
hsl(97, 43%, 92%)
HSB
hsb(97, 7%, 95%)
CMYK
cmyk(5%, 0%, 7%, 5%)
Oklch
oklch(95.1% 0.027 133.0)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#C3E8D1

Celadon · LightGray · Mint Green

HEX
#C3E8D1
RGB
rgb(195, 232, 209)
HSL
hsl(143, 45%, 84%)
HSB
hsb(143, 16%, 91%)
CMYK
cmyk(16%, 0%, 10%, 9%)
Oklch
oklch(89.8% 0.050 158.0)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#95BBC1

Sky Blue · DarkGray · Lake Green

HEX
#95BBC1
RGB
rgb(149, 187, 193)
HSL
hsl(188, 26%, 67%)
HSB
hsb(188, 23%, 76%)
CMYK
cmyk(23%, 3%, 0%, 24%)
Oklch
oklch(76.6% 0.042 208.1)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#3D3B64

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#3D3B64
RGB
rgb(61, 59, 100)
HSL
hsl(243, 26%, 31%)
HSB
hsb(243, 41%, 39%)
CMYK
cmyk(39%, 41%, 0%, 61%)
Oklch
oklch(37.4% 0.069 284.7)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#351B36

Dark Plum · DarkSlateGray · Dark Purple

HEX
#351B36
RGB
rgb(53, 27, 54)
HSL
hsl(298, 33%, 16%)
HSB
hsb(298, 50%, 21%)
CMYK
cmyk(2%, 50%, 0%, 79%)
Oklch
oklch(27.0% 0.060 325.7)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E8F3E1
EDE2F3

Analogous

F1F3E2
E8F3E1
E2F3E4

Triadic

E8F3E1
E2E9F3
F3E2E9

Split-Comp.

E8F3E1
E4E2F3
F3E2F1

Tetradic

E8F3E1
E2F1F3
EDE2F3
F3E4E2

Contrast Matrix WCAG 2.1 Contrast

E8F3E1
C3E8D1
95BBC1
3D3B64
351B36
—
1.2
Fail
1.8
Fail
9.1
AAA
13.5
AAA
1.2
Fail
—
1.6
Fail
7.9
AAA
11.6
AAA
1.8
Fail
1.6
Fail
—
5.1
AA
7.5
AAA
9.1
AAA
7.9
AAA
5.1
AA
—
1.5
Fail
13.5
AAA
11.6
AAA
7.5
AAA
1.5
Fail
—
White BG
1.1Fail
1.3Fail
2.1Fail
10.5AAA
15.4AAA
Black BG
18.3AAA
15.8AAA
10.2AAA
2.0Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDE5
D3D3D7
A5A6C0
3C3C5A
2A2A2F

Deuteranopia

ECEBE6
D1CED8
A3A0BF
3C3C58
2B2D2E

Tritanopia

E9E9EA
C5DBDC
97BEBE
3D5251
342A29

Achromatopsia

EEEEEE
DADADA
B0B0B0
404040
262626

Shades & Tints Shades & Tints

#E8F3E1

Dark
Light

#C3E8D1

Dark
Light

#95BBC1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e8f3e1;
  --color-2: #c3e8d1;
  --color-3: #95bbc1;
  --color-4: #3d3b64;
  --color-5: #351b36;
}

SCSS

$color-1: #e8f3e1;
$color-2: #c3e8d1;
$color-3: #95bbc1;
$color-4: #3d3b64;
$color-5: #351b36;

TAILWIND

colors: {
  'brand-1': '#e8f3e1',
  'brand-2': '#c3e8d1',
  'brand-3': '#95bbc1',
  'brand-4': '#3d3b64',
  'brand-5': '#351b36',
}

RGB Array

[232, 243, 225], [195, 232, 209], [149, 187, 193], [61, 59, 100], [53, 27, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #E8F3E1, #C3E8D1, #95BBC1, #3D3B64, #351B36 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e8f3e1; --color-2: #c3e8d1; --color-3: #95bbc1; --color-4: #3d3b64; --color-5: #351b36. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This cool-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color