#EDE3D3 + #E8D2AE + #9FB891 + #93C7B1 + #87D6D0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EDE3D3

Goose Yellow · Beige · Peach Orange

HEX

#EDE3D3

RGB

rgb(237, 227, 211)

HSL

hsl(37, 42%, 88%)

HSB

hsb(37, 11%, 93%)

CMYK

cmyk(0%, 4%, 11%, 7%)

Oklch

oklch(91.9% 0.024 79.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#E8D2AE

Goose Yellow · Wheat · Peach Orange

HEX

#E8D2AE

RGB

rgb(232, 210, 174)

HSL

hsl(37, 56%, 80%)

HSB

hsb(37, 25%, 91%)

CMYK

cmyk(0%, 9%, 25%, 9%)

Oklch

oklch(87.3% 0.054 80.0)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#9FB891

Celadon · DarkSeaGreen · Apple Green

HEX

#9FB891

RGB

rgb(159, 184, 145)

HSL

hsl(98, 22%, 65%)

HSB

hsb(98, 21%, 72%)

CMYK

cmyk(14%, 0%, 21%, 28%)

Oklch

oklch(75.3% 0.061 134.4)

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

#93C7B1

Jade · DarkSeaGreen · Apple Green

HEX

#93C7B1

RGB

rgb(147, 199, 177)

HSL

hsl(155, 32%, 68%)

HSB

hsb(155, 26%, 78%)

CMYK

cmyk(26%, 0%, 11%, 22%)

Oklch

oklch(78.7% 0.063 166.8)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#87D6D0

Jade · SkyBlue · Lake Green

HEX

#87D6D0

RGB

rgb(135, 214, 208)

HSL

hsl(175, 49%, 68%)

HSB

hsb(175, 37%, 84%)

CMYK

cmyk(37%, 0%, 3%, 16%)

Oklch

oklch(82.3% 0.078 189.6)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EDE3D3

D4DDED

Analogous

EDD7D4

EDE3D3

EAEDD4

Triadic

EDE3D3

D4EDE3

E3D4ED

Split-Comp.

EDE3D3

D4EAED

D7D4ED

Tetradic

EDE3D3

D4EDD7

D4DDED

EDD4EA

Contrast Matrix WCAG 2.1 Contrast

EDE3D3	E8D2AE	9FB891	93C7B1	87D6D0
—	1.2 Fail	1.7 Fail	1.5 Fail	1.3 Fail
1.2 Fail	—	1.5 Fail	1.3 Fail	1.1 Fail
1.7 Fail	1.5 Fail	—	1.1 Fail	1.3 Fail
1.5 Fail	1.3 Fail	1.1 Fail	—	1.1 Fail
1.3 Fail	1.1 Fail	1.3 Fail	1.1 Fail	—

White BG

1.3Fail

1.5Fail

2.2Fail

1.9Fail

1.7Fail

Black BG

16.5AAA

14.3AAA

9.7AAA

11.0AAA

12.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9D7

DEDEB7

AAAA9A

AAAAB6

A9AAD1

Deuteranopia

E9EAD8

E0E1B9

A8A79D

A7A3B8

A59FD2

Tritanopia

ECDADB

E7BEBF

A0A2A4

96BBBB

8BD3D3

Achromatopsia

E4E4E4

D4D4D4

ACACAC

B5B5B5

BEBEBE

Shades & Tints Shades & Tints

#EDE3D3

Dark

Light

#E8D2AE

Dark

Light

#9FB891

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ede3d3;
  --color-2: #e8d2ae;
  --color-3: #9fb891;
  --color-4: #93c7b1;
  --color-5: #87d6d0;
}

SCSS

$color-1: #ede3d3;
$color-2: #e8d2ae;
$color-3: #9fb891;
$color-4: #93c7b1;
$color-5: #87d6d0;

TAILWIND

colors: {
  'brand-1': '#ede3d3',
  'brand-2': '#e8d2ae',
  'brand-3': '#9fb891',
  'brand-4': '#93c7b1',
  'brand-5': '#87d6d0',
}

RGB Array

[237, 227, 211], [232, 210, 174], [159, 184, 145], [147, 199, 177], [135, 214, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EDE3D3, #E8D2AE, #9FB891, #93C7B1, #87D6D0 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: #ede3d3; --color-2: #e8d2ae; --color-3: #9fb891; --color-4: #93c7b1; --color-5: #87d6d0. 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