#8EB7A8 + #DACBAE + #D2A380 + #E08172 + #DE6261 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8EB7A8

Jade · DarkSeaGreen · Apple Green

HEX

#8EB7A8

RGB

rgb(142, 183, 168)

HSL

hsl(158, 22%, 64%)

HSB

hsb(158, 22%, 72%)

CMYK

cmyk(22%, 0%, 8%, 28%)

Oklch

oklch(74.5% 0.049 170.6)

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

#DACBAE

Goose Yellow · Wheat · Lemon Cream

HEX

#DACBAE

RGB

rgb(218, 203, 174)

HSL

hsl(40, 37%, 77%)

HSB

hsb(40, 20%, 85%)

CMYK

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

Oklch

oklch(84.7% 0.042 83.9)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#D2A380

Apricot · Tan · Warm Sun

HEX

#D2A380

RGB

rgb(210, 163, 128)

HSL

hsl(26, 48%, 66%)

HSB

hsb(26, 39%, 82%)

CMYK

cmyk(0%, 22%, 39%, 18%)

Oklch

oklch(75.0% 0.073 58.0)

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

#E08172

Peach Pink · LightCoral · Coral Red

HEX

#E08172

RGB

rgb(224, 129, 114)

HSL

hsl(8, 64%, 66%)

HSB

hsb(8, 49%, 88%)

CMYK

cmyk(0%, 42%, 49%, 12%)

Oklch

oklch(70.3% 0.120 29.9)

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

#DE6261

Peach Pink · Tomato · Coral Red

HEX

#DE6261

RGB

rgb(222, 98, 97)

HSL

hsl(0, 65%, 63%)

HSB

hsb(0, 56%, 87%)

CMYK

cmyk(0%, 56%, 56%, 13%)

Oklch

oklch(65.0% 0.156 22.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8EB7A8

B78F9E

Analogous

8FB794

8EB7A8

8FB2B7

Triadic

8EB7A8

A98FB7

B7A98F

Split-Comp.

8EB7A8

B78FB2

B7948F

Tetradic

8EB7A8

948FB7

B78F9E

B2B78F

Contrast Matrix WCAG 2.1 Contrast

8EB7A8	DACBAE	D2A380	E08172	DE6261
—	1.4 Fail	1.0 Fail	1.3 Fail	1.6 Fail
1.4 Fail	—	1.4 Fail	1.7 Fail	2.2 Fail
1.0 Fail	1.4 Fail	—	1.2 Fail	1.5 Fail
1.3 Fail	1.7 Fail	1.2 Fail	—	1.3 Fail
1.6 Fail	2.2 Fail	1.5 Fail	1.3 Fail	—

White BG

2.2Fail

1.6Fail

2.3Fail

2.8Fail

3.5AA Large

Black BG

9.5AAA

13.1AAA

9.3AAA

7.6AAA

6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A0A0AC

D4D3B5

BEBD88

B7B676

A8A761

Deuteranopia

9D9AAD

D4D6B7

C0C48B

BCC377

B0B961

Tritanopia

90AEAF

D9BBBC

D08F91

DB7879

D86161

Achromatopsia

A9A9A9

CCCCCC

ADADAD

9C9C9C

878787

Shades & Tints Shades & Tints

#8EB7A8

Dark

Light

#DACBAE

Dark

Light

#D2A380

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8eb7a8;
  --color-2: #dacbae;
  --color-3: #d2a380;
  --color-4: #e08172;
  --color-5: #de6261;
}

SCSS

$color-1: #8eb7a8;
$color-2: #dacbae;
$color-3: #d2a380;
$color-4: #e08172;
$color-5: #de6261;

TAILWIND

colors: {
  'brand-1': '#8eb7a8',
  'brand-2': '#dacbae',
  'brand-3': '#d2a380',
  'brand-4': '#e08172',
  'brand-5': '#de6261',
}

RGB Array

[142, 183, 168], [218, 203, 174], [210, 163, 128], [224, 129, 114], [222, 98, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8EB7A8, #DACBAE, #D2A380, #E08172, #DE6261 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: #8eb7a8; --color-2: #dacbae; --color-3: #d2a380; --color-4: #e08172; --color-5: #de6261. 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