#D8E0E3 + #EBE39A + #EEBF93 + #C98B96 + #9E8779 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#D8E0E3

Sky Blue · LightGray · Glacier Blue

HEX

#D8E0E3

RGB

rgb(216, 224, 227)

HSL

hsl(196, 16%, 87%)

HSB

hsb(196, 5%, 89%)

CMYK

cmyk(5%, 1%, 0%, 11%)

Oklch

oklch(90.1% 0.010 222.1)

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

#EBE39A

Fresh Green · Khaki · Lemon Cream

HEX

#EBE39A

RGB

rgb(235, 227, 154)

HSL

hsl(54, 67%, 76%)

HSB

hsb(54, 34%, 92%)

CMYK

cmyk(0%, 3%, 34%, 8%)

Oklch

oklch(90.6% 0.093 102.7)

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

#EEBF93

Apricot · BurlyWood · Warm Sun

HEX

#EEBF93

RGB

rgb(238, 191, 147)

HSL

hsl(29, 73%, 75%)

HSB

hsb(29, 38%, 93%)

CMYK

cmyk(0%, 20%, 38%, 7%)

Oklch

oklch(83.6% 0.079 64.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#C98B96

Peach Pink · Tan · Coral Red

HEX

#C98B96

RGB

rgb(201, 139, 150)

HSL

hsl(349, 36%, 67%)

HSB

hsb(349, 31%, 79%)

CMYK

cmyk(0%, 31%, 25%, 21%)

Oklch

oklch(70.1% 0.077 7.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#9E8779

Tangerine · Gray · Warm Sun

HEX

#9E8779

RGB

rgb(158, 135, 121)

HSL

hsl(23, 16%, 55%)

HSB

hsb(23, 23%, 62%)

CMYK

cmyk(0%, 15%, 23%, 38%)

Oklch

oklch(64.1% 0.035 53.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8E0E3

E3DBD9

Analogous

D9E3E1

D8E0E3

D9DBE3

Triadic

D8E0E3

E3D9E0

E0E3D9

Split-Comp.

D8E0E3

E3D9DB

E3E1D9

Tetradic

D8E0E3

E1D9E3

E3DBD9

DBE3D9

Contrast Matrix WCAG 2.1 Contrast

D8E0E3	EBE39A	EEBF93	C98B96	9E8779
—	1.0 Fail	1.3 Fail	2.1 Fail	2.5 Fail
1.0 Fail	—	1.3 Fail	2.1 Fail	2.6 Fail
1.3 Fail	1.3 Fail	—	1.6 Fail	2.0 Fail
2.1 Fail	2.1 Fail	1.6 Fail	—	1.2 Fail
2.5 Fail	2.6 Fail	2.0 Fail	1.2 Fail	—

White BG

1.3Fail

1.7Fail

2.8Fail

3.4AA Large

Black BG

15.7AAA

16.0AAA

12.5AAA

7.6AAA

6.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDCE2

E8E7AC

DAD99E

AEAE93

94947C

Deuteranopia

DBDAE2

E8E9B0

DCE0A0

B2B693

95977D

Tritanopia

D8E2E2

EBBABD

ECA6A8

C69191

9D7F80

Achromatopsia

DEDEDE

DDDDDD

C8C8C8

9F9F9F

8C8C8C

Shades & Tints Shades & Tints

#D8E0E3

Dark

Light

#EBE39A

Dark

Light

#EEBF93

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8e0e3;
  --color-2: #ebe39a;
  --color-3: #eebf93;
  --color-4: #c98b96;
  --color-5: #9e8779;
}

SCSS

$color-1: #d8e0e3;
$color-2: #ebe39a;
$color-3: #eebf93;
$color-4: #c98b96;
$color-5: #9e8779;

TAILWIND

colors: {
  'brand-1': '#d8e0e3',
  'brand-2': '#ebe39a',
  'brand-3': '#eebf93',
  'brand-4': '#c98b96',
  'brand-5': '#9e8779',
}

RGB Array

[216, 224, 227], [235, 227, 154], [238, 191, 147], [201, 139, 150], [158, 135, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #D8E0E3, #EBE39A, #EEBF93, #C98B96, #9E8779 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: #d8e0e3; --color-2: #ebe39a; --color-3: #eebf93; --color-4: #c98b96; --color-5: #9e8779. 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 nature-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