#A7CCA7 + #D0BCA0 + #EEAC9B + #EE94A3 + #8B887F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A7CCA7

Celadon · DarkGray · Apple Green

HEX

#A7CCA7

RGB

rgb(167, 204, 167)

HSL

hsl(120, 27%, 73%)

HSB

hsb(120, 18%, 80%)

CMYK

cmyk(18%, 0%, 18%, 20%)

Oklch

oklch(80.8% 0.065 144.9)

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

#D0BCA0

Goose Yellow · Tan · Warm Sun

HEX

#D0BCA0

RGB

rgb(208, 188, 160)

HSL

hsl(35, 34%, 72%)

HSB

hsb(35, 23%, 82%)

CMYK

cmyk(0%, 10%, 23%, 18%)

Oklch

oklch(80.5% 0.044 76.3)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#EEAC9B

Peach Pink · BurlyWood · Coral Red

HEX

#EEAC9B

RGB

rgb(238, 172, 155)

HSL

hsl(12, 71%, 77%)

HSB

hsb(12, 35%, 93%)

CMYK

cmyk(0%, 28%, 35%, 7%)

Oklch

oklch(80.2% 0.082 35.0)

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

#EE94A3

Peach Pink · LightCoral · Coral Red

HEX

#EE94A3

RGB

rgb(238, 148, 163)

HSL

hsl(350, 73%, 76%)

HSB

hsb(350, 38%, 93%)

CMYK

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

Oklch

oklch(76.3% 0.110 9.2)

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

#8B887F

Ash · Gray · Warm Gray

HEX

#8B887F

RGB

rgb(139, 136, 127)

HSL

hsl(45, 5%, 52%)

HSB

hsb(45, 9%, 55%)

CMYK

cmyk(0%, 2%, 9%, 45%)

Oklch

oklch(62.7% 0.014 91.6)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7CCA7

CDA8CD

Analogous

BACDA8

A7CCA7

A8CDBA

Triadic

A7CCA7

A8A8CD

CDA8A8

Split-Comp.

A7CCA7

BAA8CD

CDA8BA

Tetradic

A7CCA7

A8BACD

CDA8CD

CDBAA8

Contrast Matrix WCAG 2.1 Contrast

A7CCA7	D0BCA0	EEAC9B	EE94A3	8B887F
—	1.0 Fail	1.1 Fail	1.3 Fail	2.0 Fail
1.0 Fail	—	1.0 Fail	1.2 Fail	1.9 Fail
1.1 Fail	1.0 Fail	—	1.2 Fail	1.9 Fail
1.3 Fail	1.2 Fail	1.2 Fail	—	1.6 Fail
2.0 Fail	1.9 Fail	1.9 Fail	1.6 Fail	—

White BG

1.8Fail

1.9Fail

2.2Fail

3.5AA Large

Black BG

11.8AAA

11.4AAA

11.0AAA

9.4AAA

5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B7B7B0

C7C7A7

D1D19F

C7C69F

8A8A81

Deuteranopia

B5B2B2

C9CAA8

D5DAA0

CCD39F

8A8A82

Tritanopia

A9B7B9

CFACAD

EBA2A3

EA9D9C

8B8383

Achromatopsia

BDBDBD

BFBFBF

BEBEBE

B1B1B1

888888

Shades & Tints Shades & Tints

#A7CCA7

Dark

Light

#D0BCA0

Dark

Light

#EEAC9B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7cca7;
  --color-2: #d0bca0;
  --color-3: #eeac9b;
  --color-4: #ee94a3;
  --color-5: #8b887f;
}

SCSS

$color-1: #a7cca7;
$color-2: #d0bca0;
$color-3: #eeac9b;
$color-4: #ee94a3;
$color-5: #8b887f;

TAILWIND

colors: {
  'brand-1': '#a7cca7',
  'brand-2': '#d0bca0',
  'brand-3': '#eeac9b',
  'brand-4': '#ee94a3',
  'brand-5': '#8b887f',
}

RGB Array

[167, 204, 167], [208, 188, 160], [238, 172, 155], [238, 148, 163], [139, 136, 127]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A7CCA7, #D0BCA0, #EEAC9B, #EE94A3, #8B887F 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: #a7cca7; --color-2: #d0bca0; --color-3: #eeac9b; --color-4: #ee94a3; --color-5: #8b887f. 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