← Back to Editor

#85D9A0 · #9B9E73 · #D4884A · #D177C7 · #4E5222

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#85D9A0

Emerald · LightGreen · Apple Green

HEX
#85D9A0
RGB
rgb(133, 217, 160)
HSL
hsl(139, 53%, 69%)
HSB
hsb(139, 39%, 85%)
CMYK
cmyk(39%, 0%, 26%, 15%)
Oklch
oklch(81.7% 0.115 153.5)

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

#9B9E73

Autumn Sage · Gray · Sunflower

HEX
#9B9E73
RGB
rgb(155, 158, 115)
HSL
hsl(64, 18%, 54%)
HSB
hsb(64, 27%, 62%)
CMYK
cmyk(2%, 0%, 27%, 38%)
Oklch
oklch(68.6% 0.060 111.2)

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

#D4884A

Tangerine · Coral · Warm Sun

HEX
#D4884A
RGB
rgb(212, 136, 74)
HSL
hsl(27, 62%, 56%)
HSB
hsb(27, 65%, 83%)
CMYK
cmyk(0%, 36%, 65%, 17%)
Oklch
oklch(69.3% 0.121 58.0)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#D177C7

Mauve · Orchid · Lilac Purple

HEX
#D177C7
RGB
rgb(209, 119, 199)
HSL
hsl(307, 49%, 64%)
HSB
hsb(307, 43%, 82%)
CMYK
cmyk(0%, 43%, 5%, 18%)
Oklch
oklch(69.5% 0.150 331.2)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#4E5222

Autumn Sage · DarkOliveGreen · Amber Gold

HEX
#4E5222
RGB
rgb(78, 82, 34)
HSL
hsl(65, 41%, 23%)
HSB
hsb(65, 59%, 32%)
CMYK
cmyk(5%, 0%, 59%, 68%)
Oklch
oklch(42.3% 0.069 113.3)

Traditional「Autumn Sage」· Paint「Amber Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

85D9A0
DA86BF

Analogous

95DA86
85D9A0
86DACA

Triadic

85D9A0
A186DA
DAA186

Split-Comp.

85D9A0
CA86DA
DA8695

Tetradic

85D9A0
8695DA
DA86BF
DACA86

Contrast Matrix WCAG 2.1 Contrast

85D9A0
9B9E73
D4884A
D177C7
4E5222
—
1.7
Fail
1.7
Fail
1.7
Fail
4.9
AA
1.7
Fail
—
1.0
Fail
1.0
Fail
2.9
Fail
1.7
Fail
1.0
Fail
—
1.0
Fail
2.9
Fail
1.7
Fail
1.0
Fail
1.0
Fail
—
2.8
Fail
4.9
AA
2.9
Fail
2.9
Fail
2.8
Fail
—
White BG
1.7Fail
2.8Fail
2.8Fail
2.9Fail
8.2AAA
Black BG
12.4AAA
7.5AAA
7.4AAA
7.2AAA
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9AAAE
9C9C7D
B3B259
AAA9B4
50502E

Deuteranopia

A59EB1
9C9C80
B8BD5D
AFB6AF
504F30

Tritanopia

89B9BB
9B8687
D06567
CCA4A1
4E3739

Achromatopsia

B9B9B9
989898
989898
9B9B9B
4B4B4B

Shades & Tints Shades & Tints

#85D9A0

Dark
Light

#9B9E73

Dark
Light

#D4884A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #85d9a0;
  --color-2: #9b9e73;
  --color-3: #d4884a;
  --color-4: #d177c7;
  --color-5: #4e5222;
}

SCSS

$color-1: #85d9a0;
$color-2: #9b9e73;
$color-3: #d4884a;
$color-4: #d177c7;
$color-5: #4e5222;

TAILWIND

colors: {
  'brand-1': '#85d9a0',
  'brand-2': '#9b9e73',
  'brand-3': '#d4884a',
  'brand-4': '#d177c7',
  'brand-5': '#4e5222',
}

RGB Array

[133, 217, 160], [155, 158, 115], [212, 136, 74], [209, 119, 199], [78, 82, 34]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #85D9A0, #9B9E73, #D4884A, #D177C7, #4E5222 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #85d9a0; --color-2: #9b9e73; --color-3: #d4884a; --color-4: #d177c7; --color-5: #4e5222. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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