← Back to Editor

#8A8172 · #9FAD8C · #E6FFD9 · #FFC499 · #E64D5A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#8A8172

Ochre · Gray · Amber Brown

HEX
#8A8172
RGB
rgb(138, 129, 114)
HSL
hsl(37, 10%, 49%)
HSB
hsb(37, 17%, 54%)
CMYK
cmyk(0%, 7%, 17%, 46%)
Oklch
oklch(60.7% 0.025 80.6)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#9FAD8C

Willow Green · DarkSeaGreen · Apple Green

HEX
#9FAD8C
RGB
rgb(159, 173, 140)
HSL
hsl(85, 17%, 61%)
HSB
hsb(85, 19%, 68%)
CMYK
cmyk(8%, 0%, 19%, 32%)
Oklch
oklch(72.8% 0.049 126.3)

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

#E6FFD9

Emerald · Beige · Mint Green

HEX
#E6FFD9
RGB
rgb(230, 255, 217)
HSL
hsl(99, 100%, 93%)
HSB
hsb(99, 15%, 100%)
CMYK
cmyk(10%, 0%, 15%, 0%)
Oklch
oklch(97.2% 0.056 134.8)

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

#FFC499

Apricot · Wheat · Peach Orange

HEX
#FFC499
RGB
rgb(255, 196, 153)
HSL
hsl(25, 100%, 80%)
HSB
hsb(25, 40%, 100%)
CMYK
cmyk(0%, 23%, 40%, 0%)
Oklch
oklch(86.3% 0.088 57.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E64D5A

Vermilion · Tomato · Passion Red

HEX
#E64D5A
RGB
rgb(230, 77, 90)
HSL
hsl(355, 75%, 60%)
HSB
hsb(355, 67%, 90%)
CMYK
cmyk(0%, 67%, 61%, 10%)
Oklch
oklch(63.5% 0.188 19.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8A8172
707A89

Analogous

897370
8A8172
878970

Triadic

8A8172
708980
807089

Split-Comp.

8A8172
708789
737089

Tetradic

8A8172
708973
707A89
897087

Contrast Matrix WCAG 2.1 Contrast

8A8172
9FAD8C
E6FFD9
FFC499
E64D5A
—
1.6
Fail
3.6
AA Large
2.5
Fail
1.0
Fail
1.6
Fail
—
2.2
Fail
1.5
Fail
1.6
Fail
3.6
AA Large
2.2
Fail
—
1.4
Fail
3.5
AA Large
2.5
Fail
1.5
Fail
1.4
Fail
—
2.4
Fail
1.0
Fail
1.6
Fail
3.5
AA Large
2.4
Fail
—
White BG
3.8AA Large
2.4Fail
1.1Fail
1.5Fail
3.8AA Large
Black BG
5.5AA
8.8AAA
19.7AAA
13.6AAA
5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

868676
A5A594
F1F1E2
E5E5A3
A4A257

Deuteranopia

878777
A4A396
EFEEE4
E9EDA6
ADB856

Tritanopia

8A7879
A09A9C
E7E9EB
FCACAD
DE5454

Achromatopsia

828282
A5A5A5
F3F3F3
D1D1D1
7C7C7C

Shades & Tints Shades & Tints

#8A8172

Dark
Light

#9FAD8C

Dark
Light

#E6FFD9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8a8172;
  --color-2: #9fad8c;
  --color-3: #e6ffd9;
  --color-4: #ffc499;
  --color-5: #e64d5a;
}

SCSS

$color-1: #8a8172;
$color-2: #9fad8c;
$color-3: #e6ffd9;
$color-4: #ffc499;
$color-5: #e64d5a;

TAILWIND

colors: {
  'brand-1': '#8a8172',
  'brand-2': '#9fad8c',
  'brand-3': '#e6ffd9',
  'brand-4': '#ffc499',
  'brand-5': '#e64d5a',
}

RGB Array

[138, 129, 114], [159, 173, 140], [230, 255, 217], [255, 196, 153], [230, 77, 90]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8A8172, #9FAD8C, #E6FFD9, #FFC499, #E64D5A is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #8a8172; --color-2: #9fad8c; --color-3: #e6ffd9; --color-4: #ffc499; --color-5: #e64d5a. 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. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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