← Back to Editor

#6E6489 · #7F8998 · #97AFA7 · #B7C2A7 · #E3D5AF

earth

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6E6489

Deep Indigo · SlateGray · Navy Blue

HEX
#6E6489
RGB
rgb(110, 100, 137)
HSL
hsl(256, 16%, 46%)
HSB
hsb(256, 27%, 54%)
CMYK
cmyk(20%, 27%, 0%, 46%)
Oklch
oklch(52.7% 0.058 296.7)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#7F8998

Azure · LightSlateGray · Navy Blue

HEX
#7F8998
RGB
rgb(127, 137, 152)
HSL
hsl(216, 11%, 55%)
HSB
hsb(216, 16%, 60%)
CMYK
cmyk(16%, 10%, 0%, 40%)
Oklch
oklch(62.7% 0.025 258.4)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#97AFA7

Jade · DarkGray · Lake Green

HEX
#97AFA7
RGB
rgb(151, 175, 167)
HSL
hsl(160, 13%, 64%)
HSB
hsb(160, 14%, 69%)
CMYK
cmyk(14%, 0%, 5%, 31%)
Oklch
oklch(73.3% 0.029 173.4)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#B7C2A7

Willow Green · Silver · Apple Green

HEX
#B7C2A7
RGB
rgb(183, 194, 167)
HSL
hsl(84, 18%, 71%)
HSB
hsb(84, 14%, 76%)
CMYK
cmyk(6%, 0%, 14%, 24%)
Oklch
oklch(79.8% 0.039 125.4)

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

#E3D5AF

Goose Yellow · Wheat · Lemon Cream

HEX
#E3D5AF
RGB
rgb(227, 213, 175)
HSL
hsl(44, 48%, 79%)
HSB
hsb(44, 23%, 89%)
CMYK
cmyk(0%, 6%, 23%, 11%)
Oklch
oklch(87.5% 0.053 90.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6E6489
7E8863

Analogous

636B88
6E6489
7F6388

Triadic

6E6489
886D63
63886D

Split-Comp.

6E6489
887F63
6B8863

Tetradic

6E6489
88636B
7E8863
63887F

Contrast Matrix WCAG 2.1 Contrast

6E6489
7F8998
97AFA7
B7C2A7
E3D5AF
—
1.5
Fail
2.3
Fail
2.9
Fail
3.7
AA Large
1.5
Fail
—
1.5
Fail
1.9
Fail
2.4
Fail
2.3
Fail
1.5
Fail
—
1.3
Fail
1.6
Fail
2.9
Fail
1.9
Fail
1.3
Fail
—
1.3
Fail
3.7
AA Large
2.4
Fail
1.6
Fail
1.3
Fail
—
White BG
5.5AA
3.5AA Large
2.3Fail
1.9Fail
1.5Fail
Black BG
3.8AA Large
5.9AA
9.0AAA
11.3AAA
14.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6A6A80
838394
A1A2A9
BCBCAE
DDDDB8

Deuteranopia

6A6B7E
838294
A09EA9
BBBAAF
DEDFBA

Tritanopia

6E7977
7F9291
98AAAB
B8B3B4
E2BFC1

Achromatopsia

6B6B6B
888888
A7A7A7
BCBCBC
D5D5D5

Shades & Tints Shades & Tints

#6E6489

Dark
Light

#7F8998

Dark
Light

#97AFA7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6e6489;
  --color-2: #7f8998;
  --color-3: #97afa7;
  --color-4: #b7c2a7;
  --color-5: #e3d5af;
}

SCSS

$color-1: #6e6489;
$color-2: #7f8998;
$color-3: #97afa7;
$color-4: #b7c2a7;
$color-5: #e3d5af;

TAILWIND

colors: {
  'brand-1': '#6e6489',
  'brand-2': '#7f8998',
  'brand-3': '#97afa7',
  'brand-4': '#b7c2a7',
  'brand-5': '#e3d5af',
}

RGB Array

[110, 100, 137], [127, 137, 152], [151, 175, 167], [183, 194, 167], [227, 213, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #6E6489, #7F8998, #97AFA7, #B7C2A7, #E3D5AF is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #6e6489; --color-2: #7f8998; --color-3: #97afa7; --color-4: #b7c2a7; --color-5: #e3d5af. 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. Restrained colors convey professionalism and trust. 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