#8E6A65 + #D2A5A0 + #E7CDAB + #E4EFBE + #C2EACC · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8E6A65

Crimson · DimGray · Passion Red

HEX

#8E6A65

RGB

rgb(142, 106, 101)

HSL

hsl(7, 17%, 48%)

HSB

hsb(7, 29%, 56%)

CMYK

cmyk(0%, 25%, 29%, 44%)

Oklch

oklch(55.9% 0.047 27.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#D2A5A0

Peach Pink · Tan · Coral Red

HEX

#D2A5A0

RGB

rgb(210, 165, 160)

HSL

hsl(6, 36%, 73%)

HSB

hsb(6, 24%, 82%)

CMYK

cmyk(0%, 21%, 24%, 18%)

Oklch

oklch(76.2% 0.054 25.7)

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

#E7CDAB

Goose Yellow · Wheat · Peach Orange

HEX

#E7CDAB

RGB

rgb(231, 205, 171)

HSL

hsl(34, 56%, 79%)

HSB

hsb(34, 26%, 91%)

CMYK

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

Oklch

oklch(86.1% 0.054 74.4)

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

#E4EFBE

Willow Green · Wheat · Mint Green

HEX

#E4EFBE

RGB

rgb(228, 239, 190)

HSL

hsl(73, 60%, 84%)

HSB

hsb(73, 21%, 94%)

CMYK

cmyk(5%, 0%, 21%, 6%)

Oklch

oklch(93.2% 0.065 118.0)

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

#C2EACC

Celadon · LightGray · Mint Green

HEX

#C2EACC

RGB

rgb(194, 234, 204)

HSL

hsl(135, 49%, 84%)

HSB

hsb(135, 17%, 92%)

CMYK

cmyk(17%, 0%, 13%, 8%)

Oklch

oklch(90.0% 0.058 152.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8E6A65

668A8F

Analogous

8F6676

8E6A65

8F7F66

Triadic

8E6A65

668F6A

6A668F

Split-Comp.

8E6A65

668F7F

66768F

Tetradic

8E6A65

768F66

668A8F

7F668F

Contrast Matrix WCAG 2.1 Contrast

8E6A65	D2A5A0	E7CDAB	E4EFBE	C2EACC
—	2.2 Fail	3.1 AA Large	4.0 AA Large	3.6 AA Large
2.2 Fail	—	1.4 Fail	1.8 Fail	1.7 Fail
3.1 AA Large	1.4 Fail	—	1.3 Fail	1.2 Fail
4.0 AA Large	1.8 Fail	1.3 Fail	—	1.1 Fail
3.6 AA Large	1.7 Fail	1.2 Fail	1.1 Fail	—

White BG

4.8AA

2.2Fail

1.5Fail

1.2Fail

1.3Fail

Black BG

4.4AA Large

9.6AAA

13.7AAA

17.4AAA

15.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7E7E66

BFBEA1

DCDCB3

E9E9CA

D3D4D3

Deuteranopia

818366

C1C5A2

DDDFB5

E8E7CD

D1CED5

Tritanopia

8C6767

D0A2A2

E6BABB

E5D3D5

C4D9DA

Achromatopsia

747474

B2B2B2

D1D1D1

E6E6E6

DBDBDB

Shades & Tints Shades & Tints

#8E6A65

Dark

Light

#D2A5A0

Dark

Light

#E7CDAB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8e6a65;
  --color-2: #d2a5a0;
  --color-3: #e7cdab;
  --color-4: #e4efbe;
  --color-5: #c2eacc;
}

SCSS

$color-1: #8e6a65;
$color-2: #d2a5a0;
$color-3: #e7cdab;
$color-4: #e4efbe;
$color-5: #c2eacc;

TAILWIND

colors: {
  'brand-1': '#8e6a65',
  'brand-2': '#d2a5a0',
  'brand-3': '#e7cdab',
  'brand-4': '#e4efbe',
  'brand-5': '#c2eacc',
}

RGB Array

[142, 106, 101], [210, 165, 160], [231, 205, 171], [228, 239, 190], [194, 234, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #8E6A65, #D2A5A0, #E7CDAB, #E4EFBE, #C2EACC 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: #8e6a65; --color-2: #d2a5a0; --color-3: #e7cdab; --color-4: #e4efbe; --color-5: #c2eacc. 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 cool-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