← Back to Editor

#5D5D45 · #C0CE93 · #D6D69A · #F3C883 · #F9B890

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

#5D5D45

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#5D5D45
RGB
rgb(93, 93, 69)
HSL
hsl(60, 15%, 32%)
HSB
hsb(60, 26%, 36%)
CMYK
cmyk(0%, 0%, 26%, 64%)
Oklch
oklch(47.1% 0.037 107.7)

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

#C0CE93

Willow Green · Tan · Apple Green

HEX
#C0CE93
RGB
rgb(192, 206, 147)
HSL
hsl(74, 38%, 69%)
HSB
hsb(74, 29%, 81%)
CMYK
cmyk(7%, 0%, 29%, 19%)
Oklch
oklch(82.6% 0.080 119.0)

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

#D6D69A

Fresh Green · Khaki · Sunflower

HEX
#D6D69A
RGB
rgb(214, 214, 154)
HSL
hsl(60, 42%, 72%)
HSB
hsb(60, 28%, 84%)
CMYK
cmyk(0%, 0%, 28%, 16%)
Oklch
oklch(86.2% 0.078 107.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#F3C883

Goose Yellow · BurlyWood · Warm Sun

HEX
#F3C883
RGB
rgb(243, 200, 131)
HSL
hsl(37, 82%, 73%)
HSB
hsb(37, 46%, 95%)
CMYK
cmyk(0%, 18%, 46%, 5%)
Oklch
oklch(85.5% 0.100 78.7)

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

#F9B890

Apricot · BurlyWood · Peach Orange

HEX
#F9B890
RGB
rgb(249, 184, 144)
HSL
hsl(23, 90%, 77%)
HSB
hsb(23, 42%, 98%)
CMYK
cmyk(0%, 26%, 42%, 2%)
Oklch
oklch(83.3% 0.093 52.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5D5D45
45455E

Analogous

5E5245
5D5D45
525E45

Triadic

5D5D45
455E5E
5E455E

Split-Comp.

5D5D45
45525E
52455E

Tetradic

5D5D45
455E52
45455E
5E4552

Contrast Matrix WCAG 2.1 Contrast

5D5D45
C0CE93
D6D69A
F3C883
F9B890
—
4.0
AA Large
4.5
AA Large
4.3
AA Large
3.9
AA Large
4.0
AA Large
—
1.1
Fail
1.1
Fail
1.0
Fail
4.5
AA Large
1.1
Fail
—
1.0
Fail
1.1
Fail
4.3
AA Large
1.1
Fail
1.0
Fail
—
1.1
Fail
3.9
AA Large
1.0
Fail
1.1
Fail
1.1
Fail
—
White BG
6.7AA
1.7Fail
1.5Fail
1.6Fail
1.7Fail
Black BG
3.1AA Large
12.5AAA
13.9AAA
13.4AAA
12.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5D5D4B
C6C6A1
D6D6A9
E0E094
DDDC9A

Deuteranopia

5D5D4C
C5C4A5
D6D6AC
E3E698
E1E59C

Tritanopia

5D4F50
C1ADAF
D6B4B7
F1A1A4
F6A1A3

Achromatopsia

5A5A5A
C3C3C3
CFCFCF
CDCDCD
C7C7C7

Shades & Tints Shades & Tints

#5D5D45

Dark
Light

#C0CE93

Dark
Light

#D6D69A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5d5d45;
  --color-2: #c0ce93;
  --color-3: #d6d69a;
  --color-4: #f3c883;
  --color-5: #f9b890;
}

SCSS

$color-1: #5d5d45;
$color-2: #c0ce93;
$color-3: #d6d69a;
$color-4: #f3c883;
$color-5: #f9b890;

TAILWIND

colors: {
  'brand-1': '#5d5d45',
  'brand-2': '#c0ce93',
  'brand-3': '#d6d69a',
  'brand-4': '#f3c883',
  'brand-5': '#f9b890',
}

RGB Array

[93, 93, 69], [192, 206, 147], [214, 214, 154], [243, 200, 131], [249, 184, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5D5D45, #C0CE93, #D6D69A, #F3C883, #F9B890 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: #5d5d45; --color-2: #c0ce93; --color-3: #d6d69a; --color-4: #f3c883; --color-5: #f9b890. 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