← Back to Editor

#808D73 · #A8C0A0 · #B8C7AB · #D2DCC9 · #E1E7DB

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryClean

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#808D73

Celadon · Gray · Olive Green

HEX
#808D73
RGB
rgb(128, 141, 115)
HSL
hsl(90, 10%, 50%)
HSB
hsb(90, 18%, 55%)
CMYK
cmyk(9%, 0%, 18%, 45%)
Oklch
oklch(62.5% 0.041 129.2)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#A8C0A0

Celadon · DarkGray · Apple Green

HEX
#A8C0A0
RGB
rgb(168, 192, 160)
HSL
hsl(105, 20%, 69%)
HSB
hsb(105, 17%, 75%)
CMYK
cmyk(13%, 0%, 17%, 25%)
Oklch
oklch(78.1% 0.052 137.9)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#B8C7AB

Celadon · Silver · Apple Green

HEX
#B8C7AB
RGB
rgb(184, 199, 171)
HSL
hsl(92, 20%, 73%)
HSB
hsb(92, 14%, 78%)
CMYK
cmyk(8%, 0%, 14%, 22%)
Oklch
oklch(81.1% 0.042 130.4)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#D2DCC9

Celadon · LightGray · Mint Green

HEX
#D2DCC9
RGB
rgb(210, 220, 201)
HSL
hsl(92, 21%, 83%)
HSB
hsb(92, 9%, 86%)
CMYK
cmyk(5%, 0%, 9%, 14%)
Oklch
oklch(88.2% 0.028 129.8)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#E1E7DB

Celadon · Beige · Mint Green

HEX
#E1E7DB
RGB
rgb(225, 231, 219)
HSL
hsl(90, 20%, 88%)
HSB
hsb(90, 5%, 91%)
CMYK
cmyk(3%, 0%, 5%, 9%)
Oklch
oklch(92.0% 0.017 128.7)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

808D73
80738C

Analogous

8C8C73
808D73
738C73

Triadic

808D73
73808C
8C7380

Split-Comp.

808D73
73738C
8C738C

Tetradic

808D73
738C8C
80738C
8C7373

Contrast Matrix WCAG 2.1 Contrast

808D73
A8C0A0
B8C7AB
D2DCC9
E1E7DB
1.8
Fail
2.0
Fail
2.5
Fail
2.8
Fail
1.8
Fail
1.1
Fail
1.4
Fail
1.6
Fail
2.0
Fail
1.1
Fail
1.3
Fail
1.4
Fail
2.5
Fail
1.4
Fail
1.3
Fail
1.1
Fail
2.8
Fail
1.6
Fail
1.4
Fail
1.1
Fail
White BG
3.5AA Large
2.0Fail
1.8Fail
1.4Fail
1.3Fail
Black BG
6.0AA
10.7AAA
11.8AAA
14.8AAA
16.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

868679
B2B3A8
BEBFB2
D6D6CE
E4E4DE

Deuteranopia

85847B
B1AFAA
BEBCB3
D6D5CF
E3E3DF

Tritanopia

817E7F
A9AEAF
B9B7B8
D3D1D2
E1E0E1

Achromatopsia

868686
B5B5B5
BFBFBF
D7D7D7
E4E4E4

Shades & Tints Shades & Tints

#808D73

Dark
Light

#A8C0A0

Dark
Light

#B8C7AB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #808d73;
  --color-2: #a8c0a0;
  --color-3: #b8c7ab;
  --color-4: #d2dcc9;
  --color-5: #e1e7db;
}

SCSS

$color-1: #808d73;
$color-2: #a8c0a0;
$color-3: #b8c7ab;
$color-4: #d2dcc9;
$color-5: #e1e7db;

TAILWIND

colors: {
  'brand-1': '#808d73',
  'brand-2': '#a8c0a0',
  'brand-3': '#b8c7ab',
  'brand-4': '#d2dcc9',
  'brand-5': '#e1e7db',
}

RGB Array

[128, 141, 115], [168, 192, 160], [184, 199, 171], [210, 220, 201], [225, 231, 219]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #808D73, #A8C0A0, #B8C7AB, #D2DCC9, #E1E7DB is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #808d73; --color-2: #a8c0a0; --color-3: #b8c7ab; --color-4: #d2dcc9; --color-5: #e1e7db. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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