#A69C97 + #C2BA9D + #DEC395 + #C3E0C3 + #8FF2CE · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A69C97

Apricot · DarkGray · Silver Sand

HEX

#A69C97

RGB

rgb(166, 156, 151)

HSL

hsl(20, 8%, 62%)

HSB

hsb(20, 9%, 65%)

CMYK

cmyk(0%, 6%, 9%, 35%)

Oklch

oklch(70.0% 0.014 48.5)

Traditional「Apricot」· Paint「Silver Sand」· Creative Urban Concrete

#C2BA9D

Ginger · Tan · Sunflower

HEX

#C2BA9D

RGB

rgb(194, 186, 157)

HSL

hsl(47, 23%, 69%)

HSB

hsb(47, 19%, 76%)

CMYK

cmyk(0%, 4%, 19%, 24%)

Oklch

oklch(78.8% 0.041 94.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#DEC395

Goose Yellow · BurlyWood · Warm Sun

HEX

#DEC395

RGB

rgb(222, 195, 149)

HSL

hsl(38, 53%, 73%)

HSB

hsb(38, 33%, 87%)

CMYK

cmyk(0%, 12%, 33%, 13%)

Oklch

oklch(82.9% 0.068 80.8)

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

#C3E0C3

Celadon · LightGray · Mint Green

HEX

#C3E0C3

RGB

rgb(195, 224, 195)

HSL

hsl(120, 32%, 82%)

HSB

hsb(120, 13%, 88%)

CMYK

cmyk(13%, 0%, 13%, 12%)

Oklch

oklch(87.8% 0.050 145.1)

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

#8FF2CE

Jade · LightBlue · Apple Green

HEX

#8FF2CE

RGB

rgb(143, 242, 206)

HSL

hsl(158, 79%, 75%)

HSB

hsb(158, 41%, 95%)

CMYK

cmyk(41%, 0%, 15%, 5%)

Oklch

oklch(89.0% 0.107 168.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A69C97

96A1A6

Analogous

A69699

A69C97

A6A396

Triadic

A69C97

96A69C

9C96A6

Split-Comp.

A69C97

96A6A3

9699A6

Tetradic

A69C97

99A696

96A1A6

A396A6

Contrast Matrix WCAG 2.1 Contrast

A69C97	C2BA9D	DEC395	C3E0C3	8FF2CE
—	1.4 Fail	1.6 Fail	1.9 Fail	2.0 Fail
1.4 Fail	—	1.1 Fail	1.4 Fail	1.5 Fail
1.6 Fail	1.1 Fail	—	1.2 Fail	1.3 Fail
1.9 Fail	1.4 Fail	1.2 Fail	—	1.1 Fail
2.0 Fail	1.5 Fail	1.3 Fail	1.1 Fail	—

White BG

2.7Fail

1.9Fail

1.7Fail

1.4Fail

1.3Fail

Black BG

7.8AAA

10.8AAA

12.3AAA

14.8AAA

15.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A298

BFBEA4

D2D2A0

D0D0CA

BABBD7

Deuteranopia

A2A399

BFC0A6

D4D6A3

CECCCC

B4ADD9

Tritanopia

A69999

C2AAAB

DDA9AB

C4D0D1

94DEDF

Achromatopsia

9E9E9E

B9B9B9

C6C6C6

D4D4D4

D0D0D0

Shades & Tints Shades & Tints

#A69C97

Dark

Light

#C2BA9D

Dark

Light

#DEC395

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a69c97;
  --color-2: #c2ba9d;
  --color-3: #dec395;
  --color-4: #c3e0c3;
  --color-5: #8ff2ce;
}

SCSS

$color-1: #a69c97;
$color-2: #c2ba9d;
$color-3: #dec395;
$color-4: #c3e0c3;
$color-5: #8ff2ce;

TAILWIND

colors: {
  'brand-1': '#a69c97',
  'brand-2': '#c2ba9d',
  'brand-3': '#dec395',
  'brand-4': '#c3e0c3',
  'brand-5': '#8ff2ce',
}

RGB Array

[166, 156, 151], [194, 186, 157], [222, 195, 149], [195, 224, 195], [143, 242, 206]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #A69C97, #C2BA9D, #DEC395, #C3E0C3, #8FF2CE 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: #a69c97; --color-2: #c2ba9d; --color-3: #dec395; --color-4: #c3e0c3; --color-5: #8ff2ce. 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 earth-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