← Back to Editor

#C9C124 · #888844 · #834F4A · #70394E · #A237B8

earth

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C9C124

Autumn Sage · GoldenRod · Honey Gold

HEX
#C9C124
RGB
rgb(201, 193, 36)
HSL
hsl(57, 70%, 46%)
HSB
hsb(57, 82%, 79%)
CMYK
cmyk(0%, 4%, 82%, 21%)
Oklch
oklch(79.3% 0.161 106.4)

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

#888844

Autumn Sage · DimGray · Honey Gold

HEX
#888844
RGB
rgb(136, 136, 68)
HSL
hsl(60, 33%, 40%)
HSB
hsb(60, 50%, 53%)
CMYK
cmyk(0%, 0%, 50%, 47%)
Oklch
oklch(61.1% 0.091 108.8)

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

#834F4A

Crimson · Sienna · Wine Red

HEX
#834F4A
RGB
rgb(131, 79, 74)
HSL
hsl(5, 28%, 40%)
HSB
hsb(5, 44%, 51%)
CMYK
cmyk(0%, 40%, 44%, 49%)
Oklch
oklch(48.6% 0.071 25.9)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#70394E

Dark Violet · DimGray · Camellia

HEX
#70394E
RGB
rgb(112, 57, 78)
HSL
hsl(337, 33%, 33%)
HSB
hsb(337, 49%, 44%)
CMYK
cmyk(0%, 49%, 30%, 56%)
Oklch
oklch(42.1% 0.082 356.9)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#A237B8

Royal Purple · DarkOrchid · Violet

HEX
#A237B8
RGB
rgb(162, 55, 184)
HSL
hsl(290, 54%, 47%)
HSB
hsb(290, 70%, 72%)
CMYK
cmyk(12%, 70%, 0%, 28%)
Oklch
oklch(54.4% 0.207 320.3)

Traditional「Royal Purple」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9C124
232BC7

Analogous

C76D23
C9C124
7EC723

Triadic

C9C124
23C7BF
BF23C7

Split-Comp.

C9C124
237EC7
6D23C7

Tetradic

C9C124
23C76D
232BC7
C7237E

Contrast Matrix WCAG 2.1 Contrast

C9C124
888844
834F4A
70394E
A237B8
—
2.0
Fail
3.5
AA Large
4.7
AA
3.0
Fail
2.0
Fail
—
1.8
Fail
2.4
Fail
1.5
Fail
3.5
AA Large
1.8
Fail
—
1.3
Fail
1.2
Fail
4.7
AA
2.4
Fail
1.3
Fail
—
1.6
Fail
3.0
Fail
1.5
Fail
1.2
Fail
1.6
Fail
—
White BG
1.9Fail
3.7AA Large
6.6AA
8.8AAA
5.6AA
Black BG
11.1AAA
5.7AA
3.2AA Large
2.4Fail
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

C6C54A
888854
6C6C4B
585849
747399

Deuteranopia

C6C753
888858
70734C
5B5F48
7A8291

Tritanopia

C9686F
886164
804C4C
6D4544
9D807B

Achromatopsia

B1B1B1
808080
5E5E5E
4C4C4C
666666

Shades & Tints Shades & Tints

#C9C124

Dark
Light

#888844

Dark
Light

#834F4A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9c124;
  --color-2: #888844;
  --color-3: #834f4a;
  --color-4: #70394e;
  --color-5: #a237b8;
}

SCSS

$color-1: #c9c124;
$color-2: #888844;
$color-3: #834f4a;
$color-4: #70394e;
$color-5: #a237b8;

TAILWIND

colors: {
  'brand-1': '#c9c124',
  'brand-2': '#888844',
  'brand-3': '#834f4a',
  'brand-4': '#70394e',
  'brand-5': '#a237b8',
}

RGB Array

[201, 193, 36], [136, 136, 68], [131, 79, 74], [112, 57, 78], [162, 55, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #C9C124, #888844, #834F4A, #70394E, #A237B8 is ideal for: corporate websites, product showcases, portfolios. 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: #c9c124; --color-2: #888844; --color-3: #834f4a; --color-4: #70394e; --color-5: #a237b8. 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. 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