← Back to Editor

#E1FAFC · #D5E9EB · #A7CED1 · #E6EAEB · #42ABB3

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#E1FAFC

Sky Blue · Lavender · Glacier Blue

HEX
#E1FAFC
RGB
rgb(225, 250, 252)
HSL
hsl(184, 82%, 94%)
HSB
hsb(184, 11%, 99%)
CMYK
cmyk(11%, 1%, 0%, 1%)
Oklch
oklch(96.8% 0.026 202.6)

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

#D5E9EB

Sky Blue · Lavender · Glacier Blue

HEX
#D5E9EB
RGB
rgb(213, 233, 235)
HSL
hsl(185, 35%, 88%)
HSB
hsb(185, 9%, 92%)
CMYK
cmyk(9%, 1%, 0%, 8%)
Oklch
oklch(92.0% 0.021 204.0)

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

#A7CED1

Sky Blue · LightSteelBlue · Lake Green

HEX
#A7CED1
RGB
rgb(167, 206, 209)
HSL
hsl(184, 31%, 74%)
HSB
hsb(184, 20%, 82%)
CMYK
cmyk(20%, 1%, 0%, 18%)
Oklch
oklch(82.4% 0.041 202.2)

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

#E6EAEB

Sky Blue · Lavender · Glacier Blue

HEX
#E6EAEB
RGB
rgb(230, 234, 235)
HSL
hsl(192, 11%, 91%)
HSB
hsb(192, 2%, 92%)
CMYK
cmyk(2%, 0%, 0%, 8%)
Oklch
oklch(93.4% 0.005 214.3)

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

#42ABB3

Slate Blue · LightSeaGreen · Mint Ice

HEX
#42ABB3
RGB
rgb(66, 171, 179)
HSL
hsl(184, 46%, 48%)
HSB
hsb(184, 63%, 70%)
CMYK
cmyk(63%, 4%, 0%, 30%)
Oklch
oklch(68.4% 0.095 202.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1FAFC
FCE5E3

Analogous

E3FCF1
E1FAFC
E3EEFC

Triadic

E1FAFC
FCE3FB
FBFCE3

Split-Comp.

E1FAFC
FCE3EE
FCF1E3

Tetradic

E1FAFC
F1E3FC
FCE5E3
EEFCE3

Contrast Matrix WCAG 2.1 Contrast

E1FAFC
D5E9EB
A7CED1
E6EAEB
42ABB3
—
1.2
Fail
1.6
Fail
1.1
Fail
2.5
Fail
1.2
Fail
—
1.3
Fail
1.0
Fail
2.2
Fail
1.6
Fail
1.3
Fail
—
1.4
Fail
1.6
Fail
1.1
Fail
1.0
Fail
1.4
Fail
—
2.2
Fail
2.5
Fail
2.2
Fail
1.6
Fail
2.2
Fail
—
White BG
1.1Fail
1.3Fail
1.7Fail
1.2Fail
2.7Fail
Black BG
19.3AAA
16.7AAA
12.4AAA
17.3AAA
7.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ECECFC
DEDEEB
B8B8D0
E8E8EB
6F70B1

Deuteranopia

EAE9FB
DDDBEA
B6B3D0
E8E7EB
6962B1

Tritanopia

E2FBFB
D6EAEA
A9D0D0
E6EBEB
47B0AF

Achromatopsia

F3F3F3
E3E3E3
C3C3C3
E9E9E9
8D8D8D

Shades & Tints Shades & Tints

#E1FAFC

Dark
Light

#D5E9EB

Dark
Light

#A7CED1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1fafc;
  --color-2: #d5e9eb;
  --color-3: #a7ced1;
  --color-4: #e6eaeb;
  --color-5: #42abb3;
}

SCSS

$color-1: #e1fafc;
$color-2: #d5e9eb;
$color-3: #a7ced1;
$color-4: #e6eaeb;
$color-5: #42abb3;

TAILWIND

colors: {
  'brand-1': '#e1fafc',
  'brand-2': '#d5e9eb',
  'brand-3': '#a7ced1',
  'brand-4': '#e6eaeb',
  'brand-5': '#42abb3',
}

RGB Array

[225, 250, 252], [213, 233, 235], [167, 206, 209], [230, 234, 235], [66, 171, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1FAFC, #D5E9EB, #A7CED1, #E6EAEB, #42ABB3 is ideal for: health products, baby brands, fresh-style blogs, 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: #e1fafc; --color-2: #d5e9eb; --color-3: #a7ced1; --color-4: #e6eaeb; --color-5: #42abb3. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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