#E5F2CF + #E3E3B6 + #E7C2A7 + #B39D99 + #82787A - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E5F2CF

Willow Green · Beige · Mint Green

HEX

#E5F2CF

RGB

rgb(229, 242, 207)

HSL

hsl(82, 57%, 88%)

HSB

hsb(82, 14%, 95%)

CMYK

cmyk(5%, 0%, 14%, 5%)

Oklch

oklch(94.2% 0.048 123.9)

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

#E3E3B6

Fresh Green · Wheat · Lemon Cream

HEX

#E3E3B6

RGB

rgb(227, 227, 182)

HSL

hsl(60, 45%, 80%)

HSB

hsb(60, 20%, 89%)

CMYK

cmyk(0%, 0%, 20%, 11%)

Oklch

oklch(90.5% 0.059 107.5)

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

#E7C2A7

Apricot · Wheat · Peach Orange

HEX

#E7C2A7

RGB

rgb(231, 194, 167)

HSL

hsl(25, 57%, 78%)

HSB

hsb(25, 28%, 91%)

CMYK

cmyk(0%, 16%, 28%, 9%)

Oklch

oklch(83.9% 0.056 58.0)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#B39D99

Peach Pink · DarkGray · Coral Red

HEX

#B39D99

RGB

rgb(179, 157, 153)

HSL

hsl(9, 15%, 65%)

HSB

hsb(9, 15%, 70%)

CMYK

cmyk(0%, 12%, 15%, 30%)

Oklch

oklch(71.4% 0.027 30.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#82787A

Ink Gray · Gray · Warm Gray

HEX

#82787A

RGB

rgb(130, 120, 122)

HSL

hsl(348, 4%, 49%)

HSB

hsb(348, 8%, 51%)

CMYK

cmyk(0%, 8%, 6%, 49%)

Oklch

oklch(58.2% 0.013 3.8)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E5F2CF

DCCFF2

Analogous

F2EDCF

E5F2CF

D4F2CF

Triadic

E5F2CF

CFE5F2

F2CFE5

Split-Comp.

E5F2CF

CFD4F2

EDCFF2

Tetradic

E5F2CF

CFF2ED

DCCFF2

F2CFD4

Contrast Matrix WCAG 2.1 Contrast

E5F2CF	E3E3B6	E7C2A7	B39D99	82787A
—	1.1 Fail	1.4 Fail	2.2 Fail	3.6 AA Large
1.1 Fail	—	1.3 Fail	1.9 Fail	3.2 AA Large
1.4 Fail	1.3 Fail	—	1.5 Fail	2.6 Fail
2.2 Fail	1.9 Fail	1.5 Fail	—	1.7 Fail
3.6 AA Large	3.2 AA Large	2.6 Fail	1.7 Fail	—

White BG

1.2Fail

1.3Fail

1.7Fail

2.6Fail

4.3AA Large

Black BG

17.9AAA

15.9AAA

12.7AAA

8.2AAA

4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEBD7

E3E3C1

D7D7AE

A9A99A

7E7E7A

Deuteranopia

EAE9D9

E3E3C4

D9DCAF

ABAC9A

7E7F79

Tritanopia

E6DEE0

E3C9CB

E5B3B4

B29B9B

827979

Achromatopsia

EAEAEA

DEDEDE

CACACA

A3A3A3

7B7B7B

Shades & Tints Shades & Tints

#E5F2CF

Dark

Light

#E3E3B6

Dark

Light

#E7C2A7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e5f2cf;
  --color-2: #e3e3b6;
  --color-3: #e7c2a7;
  --color-4: #b39d99;
  --color-5: #82787a;
}

SCSS

$color-1: #e5f2cf;
$color-2: #e3e3b6;
$color-3: #e7c2a7;
$color-4: #b39d99;
$color-5: #82787a;

TAILWIND

colors: {
  'brand-1': '#e5f2cf',
  'brand-2': '#e3e3b6',
  'brand-3': '#e7c2a7',
  'brand-4': '#b39d99',
  'brand-5': '#82787a',
}

RGB Array

[229, 242, 207], [227, 227, 182], [231, 194, 167], [179, 157, 153], [130, 120, 122]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E5F2CF, #E3E3B6, #E7C2A7, #B39D99, #82787A is ideal for: health products, baby brands, fresh-style blogs. 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: #e5f2cf; --color-2: #e3e3b6; --color-3: #e7c2a7; --color-4: #b39d99; --color-5: #82787a. 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 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