← Back to Editor

#E1F1F1 · #91D4DD · #3FA2A7 · #45334B · #EEECDF

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#E1F1F1

Sky Blue · Lavender · Glacier Blue

HEX
#E1F1F1
RGB
rgb(225, 241, 241)
HSL
hsl(180, 36%, 91%)
HSB
hsb(180, 7%, 95%)
CMYK
cmyk(7%, 0%, 0%, 5%)
Oklch
oklch(94.6% 0.017 196.9)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#91D4DD

Sky Blue · SkyBlue · Lake Green

HEX
#91D4DD
RGB
rgb(145, 212, 221)
HSL
hsl(187, 53%, 72%)
HSB
hsb(187, 34%, 87%)
CMYK
cmyk(34%, 4%, 0%, 13%)
Oklch
oklch(82.8% 0.069 206.5)

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

#3FA2A7

Slate Blue · CadetBlue · Mint Ice

HEX
#3FA2A7
RGB
rgb(63, 162, 167)
HSL
hsl(183, 45%, 45%)
HSB
hsb(183, 62%, 65%)
CMYK
cmyk(62%, 3%, 0%, 35%)
Oklch
oklch(65.7% 0.091 199.9)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#45334B

Dark Plum · DarkSlateGray · Eggplant

HEX
#45334B
RGB
rgb(69, 51, 75)
HSL
hsl(285, 19%, 25%)
HSB
hsb(285, 32%, 29%)
CMYK
cmyk(8%, 32%, 0%, 71%)
Oklch
oklch(35.1% 0.047 317.5)

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

#EEECDF

Fresh Green · Beige · Lemon Cream

HEX
#EEECDF
RGB
rgb(238, 236, 223)
HSL
hsl(52, 31%, 90%)
HSB
hsb(52, 6%, 93%)
CMYK
cmyk(0%, 1%, 6%, 7%)
Oklch
oklch(94.1% 0.017 99.6)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1F1F1
F0E0E0

Analogous

E0F0E8
E1F1F1
E0E8F0

Triadic

E1F1F1
F0E0F0
F0F0E0

Split-Comp.

E1F1F1
F0E0E8
F0E8E0

Tetradic

E1F1F1
E8E0F0
F0E0E0
E8F0E0

Contrast Matrix WCAG 2.1 Contrast

E1F1F1
91D4DD
3FA2A7
45334B
EEECDF
—
1.4
Fail
2.6
Fail
9.9
AAA
1.0
Fail
1.4
Fail
—
1.8
Fail
6.9
AA
1.4
Fail
2.6
Fail
1.8
Fail
—
3.8
AA Large
2.6
Fail
9.9
AAA
6.9
AA
3.8
AA Large
—
9.7
AAA
1.0
Fail
1.4
Fail
2.6
Fail
9.7
AAA
—
White BG
1.2Fail
1.7Fail
3.0AA Large
11.5AAA
1.2Fail
Black BG
18.1AAA
12.7AAA
6.9AA
1.8Fail
17.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8F1
AEAFDB
6A6BA6
3D3D45
EDEDE2

Deuteranopia

E7E6F1
AAA5DA
645DA6
3E4044
EDEDE3

Tritanopia

E2F1F1
94D9D9
44A5A5
444140
EEE5E5

Achromatopsia

ECECEC
C1C1C1
858585
3B3B3B
EBEBEB

Shades & Tints Shades & Tints

#E1F1F1

Dark
Light

#91D4DD

Dark
Light

#3FA2A7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1f1f1;
  --color-2: #91d4dd;
  --color-3: #3fa2a7;
  --color-4: #45334b;
  --color-5: #eeecdf;
}

SCSS

$color-1: #e1f1f1;
$color-2: #91d4dd;
$color-3: #3fa2a7;
$color-4: #45334b;
$color-5: #eeecdf;

TAILWIND

colors: {
  'brand-1': '#e1f1f1',
  'brand-2': '#91d4dd',
  'brand-3': '#3fa2a7',
  'brand-4': '#45334b',
  'brand-5': '#eeecdf',
}

RGB Array

[225, 241, 241], [145, 212, 221], [63, 162, 167], [69, 51, 75], [238, 236, 223]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1F1F1, #91D4DD, #3FA2A7, #45334B, #EEECDF 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: #e1f1f1; --color-2: #91d4dd; --color-3: #3fa2a7; --color-4: #45334b; --color-5: #eeecdf. 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 general-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