← Back to Editor

#A0B594 · #B3B573 · #C6B75A · #E3B030 · #FF9E09

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

#A0B594

Celadon · DarkSeaGreen · Apple Green

HEX
#A0B594
RGB
rgb(160, 181, 148)
HSL
hsl(98, 18%, 65%)
HSB
hsb(98, 18%, 71%)
CMYK
cmyk(12%, 0%, 18%, 29%)
Oklch
oklch(74.8% 0.052 134.2)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#B3B573

Autumn Sage · Tan · Sunflower

HEX
#B3B573
RGB
rgb(179, 181, 115)
HSL
hsl(62, 31%, 58%)
HSB
hsb(62, 36%, 71%)
CMYK
cmyk(1%, 0%, 36%, 29%)
Oklch
oklch(75.6% 0.087 109.8)

TraditionalAutumn Sage」· PaintSunflower」· Creative Blush Sunrise

#C6B75A

Autumn Sage · SandyBrown · Sunflower

HEX
#C6B75A
RGB
rgb(198, 183, 90)
HSL
hsl(52, 49%, 56%)
HSB
hsb(52, 55%, 78%)
CMYK
cmyk(0%, 8%, 55%, 22%)
Oklch
oklch(77.3% 0.116 100.3)

TraditionalAutumn Sage」· PaintSunflower」· Creative Blush Sunrise

#E3B030

Ginger · GoldenRod · Sunflower

HEX
#E3B030
RGB
rgb(227, 176, 48)
HSL
hsl(43, 76%, 54%)
HSB
hsb(43, 79%, 89%)
CMYK
cmyk(0%, 22%, 79%, 11%)
Oklch
oklch(78.3% 0.147 85.2)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#FF9E09

Ginger · Orange · Warm Sun

HEX
#FF9E09
RGB
rgb(255, 158, 9)
HSL
hsl(36, 100%, 52%)
HSB
hsb(36, 96%, 100%)
CMYK
cmyk(0%, 38%, 96%, 0%)
Oklch
oklch(78.1% 0.171 66.7)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A0B594
AA96B6

Analogous

B2B696
A0B594
96B69A

Triadic

A0B594
96A1B6
B696A1

Split-Comp.

A0B594
9A96B6
B696B2

Tetradic

A0B594
96B2B6
AA96B6
B69A96

Contrast Matrix WCAG 2.1 Contrast

A0B594
B3B573
C6B75A
E3B030
FF9E09
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.0
Fail
White BG
2.2Fail
2.1Fail
2.0Fail
2.0Fail
2.1Fail
Black BG
9.5AAA
9.8AAA
10.3AAA
10.5AAA
10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A99C
B4B483
C0BF71
CDCC4F
D5D42D

Deuteranopia

A8A69E
B4B487
C0C276
D0D456
DBE236

Tritanopia

A1A2A4
B39092
C58286
E0676D
FA4A50

Achromatopsia

ABABAB
ADADAD
B1B1B1
B1B1B1
AAAAAA

Shades & Tints Shades & Tints

#A0B594

Dark
Light

#B3B573

Dark
Light

#C6B75A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a0b594;
  --color-2: #b3b573;
  --color-3: #c6b75a;
  --color-4: #e3b030;
  --color-5: #ff9e09;
}

SCSS

$color-1: #a0b594;
$color-2: #b3b573;
$color-3: #c6b75a;
$color-4: #e3b030;
$color-5: #ff9e09;

TAILWIND

colors: {
  'brand-1': '#a0b594',
  'brand-2': '#b3b573',
  'brand-3': '#c6b75a',
  'brand-4': '#e3b030',
  'brand-5': '#ff9e09',
}

RGB Array

[160, 181, 148], [179, 181, 115], [198, 183, 90], [227, 176, 48], [255, 158, 9]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #A0B594, #B3B573, #C6B75A, #E3B030, #FF9E09 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: #a0b594; --color-2: #b3b573; --color-3: #c6b75a; --color-4: #e3b030; --color-5: #ff9e09. 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