#8E6C60 + #969870 + #ABB47D + #C0B77E + #E0CD92 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#8E6C60

Tangerine · DimGray · Amber Brown

HEX

#8E6C60

RGB

rgb(142, 108, 96)

HSL

hsl(16, 19%, 47%)

HSB

hsb(16, 32%, 56%)

CMYK

cmyk(0%, 24%, 32%, 44%)

Oklch

oklch(56.2% 0.047 40.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#969870

Autumn Sage · Gray · Sunflower

HEX

#969870

RGB

rgb(150, 152, 112)

HSL

hsl(63, 16%, 52%)

HSB

hsb(63, 26%, 60%)

CMYK

cmyk(1%, 0%, 26%, 40%)

Oklch

oklch(66.8% 0.056 110.2)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#ABB47D

Grass Green · DarkSeaGreen · Olive Green

HEX

#ABB47D

RGB

rgb(171, 180, 125)

HSL

hsl(70, 27%, 60%)

HSB

hsb(70, 31%, 71%)

CMYK

cmyk(5%, 0%, 31%, 29%)

Oklch

oklch(74.9% 0.075 115.8)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#C0B77E

Fresh Green · Tan · Sunflower

HEX

#C0B77E

RGB

rgb(192, 183, 126)

HSL

hsl(52, 34%, 62%)

HSB

hsb(52, 34%, 75%)

CMYK

cmyk(0%, 5%, 34%, 25%)

Oklch

oklch(77.3% 0.076 100.3)

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

#E0CD92

Goose Yellow · BurlyWood · Sunflower

HEX

#E0CD92

RGB

rgb(224, 205, 146)

HSL

hsl(45, 56%, 73%)

HSB

hsb(45, 35%, 88%)

CMYK

cmyk(0%, 8%, 35%, 12%)

Oklch

oklch(85.0% 0.079 92.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8E6C60

61828F

Analogous

8F616C

8E6C60

8F8461

Triadic

8E6C60

618F6D

6D618F

Split-Comp.

8E6C60

618F84

616C8F

Tetradic

8E6C60

6C8F61

61828F

84618F

Contrast Matrix WCAG 2.1 Contrast

8E6C60	969870	ABB47D	C0B77E	E0CD92
—	1.6 Fail	2.1 Fail	2.3 Fail	3.0 Fail
1.6 Fail	—	1.4 Fail	1.5 Fail	1.9 Fail
2.1 Fail	1.4 Fail	—	1.1 Fail	1.4 Fail
2.3 Fail	1.5 Fail	1.1 Fail	—	1.3 Fail
3.0 Fail	1.9 Fail	1.4 Fail	1.3 Fail	—

White BG

4.7AA

3.0Fail

2.2Fail

2.0Fail

1.6Fail

Black BG

4.5AA Large

7.0AAA

9.6AAA

10.3AAA

13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F7F63

97977A

AFAF8A

BCBC8C

D8D8A0

Deuteranopia

818464

97977C

AEAE8E

BDBD8F

D9DAA4

Tritanopia

8C6566

968183

AB9597

C09799

DFACAE

Achromatopsia

757575

939393

ABABAB

B3B3B3

CCCCCC

Shades & Tints Shades & Tints

#8E6C60

Dark

Light

#969870

Dark

Light

#ABB47D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8e6c60;
  --color-2: #969870;
  --color-3: #abb47d;
  --color-4: #c0b77e;
  --color-5: #e0cd92;
}

SCSS

$color-1: #8e6c60;
$color-2: #969870;
$color-3: #abb47d;
$color-4: #c0b77e;
$color-5: #e0cd92;

TAILWIND

colors: {
  'brand-1': '#8e6c60',
  'brand-2': '#969870',
  'brand-3': '#abb47d',
  'brand-4': '#c0b77e',
  'brand-5': '#e0cd92',
}

RGB Array

[142, 108, 96], [150, 152, 112], [171, 180, 125], [192, 183, 126], [224, 205, 146]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #8E6C60, #969870, #ABB47D, #C0B77E, #E0CD92 is ideal for: corporate websites, product showcases, portfolios. 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: #8e6c60; --color-2: #969870; --color-3: #abb47d; --color-4: #c0b77e; --color-5: #e0cd92. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 pastel-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