← Back to Editor

#E4E2CB · #BAC5E5 · #A4C2C4 · #85B0B7 · #7893A6

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E4E2CB

Fresh Green · LightGray · Lemon Cream

HEX
#E4E2CB
RGB
rgb(228, 226, 203)
HSL
hsl(55, 32%, 85%)
HSB
hsb(55, 11%, 89%)
CMYK
cmyk(0%, 1%, 11%, 11%)
Oklch
oklch(90.8% 0.031 102.9)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#BAC5E5

Azure · LightSteelBlue · Sky Blue

HEX
#BAC5E5
RGB
rgb(186, 197, 229)
HSL
hsl(225, 45%, 81%)
HSB
hsb(225, 19%, 90%)
CMYK
cmyk(19%, 14%, 0%, 10%)
Oklch
oklch(82.5% 0.047 270.4)

TraditionalAzure」· PaintSky Blue」· Creative Twilight Haze

#A4C2C4

Sky Blue · Silver · Lake Green

HEX
#A4C2C4
RGB
rgb(164, 194, 196)
HSL
hsl(184, 21%, 71%)
HSB
hsb(184, 16%, 77%)
CMYK
cmyk(16%, 1%, 0%, 23%)
Oklch
oklch(79.2% 0.032 201.5)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#85B0B7

Sky Blue · DarkGray · Lake Green

HEX
#85B0B7
RGB
rgb(133, 176, 183)
HSL
hsl(188, 26%, 62%)
HSB
hsb(188, 27%, 72%)
CMYK
cmyk(27%, 4%, 0%, 28%)
Oklch
oklch(72.9% 0.047 208.5)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#7893A6

Slate Blue · LightSlateGray · Navy Blue

HEX
#7893A6
RGB
rgb(120, 147, 166)
HSL
hsl(205, 21%, 56%)
HSB
hsb(205, 28%, 65%)
CMYK
cmyk(28%, 11%, 0%, 35%)
Oklch
oklch(64.9% 0.042 239.0)

TraditionalSlate Blue」· PaintNavy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E4E2CB
CDCFE5

Analogous

E5D7CD
E4E2CB
DBE5CD

Triadic

E4E2CB
CDE5E3
E3CDE5

Split-Comp.

E4E2CB
CDDBE5
D7CDE5

Tetradic

E4E2CB
CDE5D7
CDCFE5
E5CDDB

Contrast Matrix WCAG 2.1 Contrast

E4E2CB
BAC5E5
A4C2C4
85B0B7
7893A6
1.3
Fail
1.4
Fail
1.8
Fail
2.5
Fail
1.3
Fail
1.1
Fail
1.4
Fail
1.9
Fail
1.4
Fail
1.1
Fail
1.2
Fail
1.7
Fail
1.8
Fail
1.4
Fail
1.2
Fail
1.4
Fail
2.5
Fail
1.9
Fail
1.7
Fail
1.4
Fail
White BG
1.3Fail
1.7Fail
1.9Fail
2.4Fail
3.2AA Large
Black BG
16.0AAA
12.2AAA
11.1AAA
8.9AAA
6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E3E3D1
BFBFDD
B1B1C4
9898B5
8484A1

Deuteranopia

E3E3D2
BEBDDB
AFADC3
9592B5
8280A0

Tritanopia

E4D5D6
BBD7D6
A5C3C3
87B4B4
799E9D

Achromatopsia

E0E0E0
C5C5C5
B9B9B9
A4A4A4
8D8D8D

Shades & Tints Shades & Tints

#E4E2CB

Dark
Light

#BAC5E5

Dark
Light

#A4C2C4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e4e2cb;
  --color-2: #bac5e5;
  --color-3: #a4c2c4;
  --color-4: #85b0b7;
  --color-5: #7893a6;
}

SCSS

$color-1: #e4e2cb;
$color-2: #bac5e5;
$color-3: #a4c2c4;
$color-4: #85b0b7;
$color-5: #7893a6;

TAILWIND

colors: {
  'brand-1': '#e4e2cb',
  'brand-2': '#bac5e5',
  'brand-3': '#a4c2c4',
  'brand-4': '#85b0b7',
  'brand-5': '#7893a6',
}

RGB Array

[228, 226, 203], [186, 197, 229], [164, 194, 196], [133, 176, 183], [120, 147, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E4E2CB, #BAC5E5, #A4C2C4, #85B0B7, #7893A6 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e4e2cb; --color-2: #bac5e5; --color-3: #a4c2c4; --color-4: #85b0b7; --color-5: #7893a6. 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. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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