← Back to Editor

#631B1B · #000000 · #7B7844 · #799485 · #E3DDAB

earth

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#631B1B

Crimson · Maroon · Wine Red

HEX
#631B1B
RGB
rgb(99, 27, 27)
HSL
hsl(0, 57%, 25%)
HSB
hsb(0, 73%, 39%)
CMYK
cmyk(0%, 73%, 73%, 61%)
Oklch
oklch(34.0% 0.104 24.5)

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

#000000

Ink Black · Black · Jet Black

HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
HSB
hsb(0, 0%, 0%)
CMYK
cmyk(0%, 0%, 0%, 100%)
Oklch
oklch(0.0% 0.000 0.0)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#7B7844

Autumn Sage · DimGray · Honey Gold

HEX
#7B7844
RGB
rgb(123, 120, 68)
HSL
hsl(57, 29%, 37%)
HSB
hsb(57, 45%, 48%)
CMYK
cmyk(0%, 2%, 45%, 52%)
Oklch
oklch(56.3% 0.072 105.6)

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

#799485

Celadon · Gray · Olive Green

HEX
#799485
RGB
rgb(121, 148, 133)
HSL
hsl(147, 11%, 53%)
HSB
hsb(147, 18%, 58%)
CMYK
cmyk(18%, 0%, 10%, 42%)
Oklch
oklch(64.1% 0.038 160.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#E3DDAB

Fresh Green · Wheat · Lemon Cream

HEX
#E3DDAB
RGB
rgb(227, 221, 171)
HSL
hsl(54, 50%, 78%)
HSB
hsb(54, 25%, 89%)
CMYK
cmyk(0%, 3%, 25%, 11%)
Oklch
oklch(89.0% 0.066 101.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

631B1B
1B6464

Analogous

641B40
631B1B
64401B

Triadic

631B1B
1B641B
1B1B64

Split-Comp.

631B1B
1B6440
1B4064

Tetradic

631B1B
40641B
1B6464
401B64

Contrast Matrix WCAG 2.1 Contrast

631B1B
000000
7B7844
799485
E3DDAB
—
1.7
Fail
2.7
Fail
3.8
AA Large
8.9
AAA
1.7
Fail
—
4.6
AA
6.4
AA
15.2
AAA
2.7
Fail
4.6
AA
—
1.4
Fail
3.3
AA Large
3.8
AA Large
6.4
AA
1.4
Fail
—
2.4
Fail
8.9
AAA
15.2
AAA
3.3
AA Large
2.4
Fail
—
White BG
12.3AAA
21.0AAA
4.6AA
3.3AA Large
1.4Fail
Black BG
1.7Fail
1.0Fail
4.6AA
6.4AA
15.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

44431B
000000
7A7A51
858589
E0E0B7

Deuteranopia

484D1B
000000
7A7A54
83818A
E1E1BA

Tritanopia

5F1B1B
000000
7B5B5D
7A8B8C
E3C1C3

Achromatopsia

313131
000000
737373
8A8A8A
D9D9D9

Shades & Tints Shades & Tints

#631B1B

Dark
Light

#000000

Dark
Light

#7B7844

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #631b1b;
  --color-2: #000000;
  --color-3: #7b7844;
  --color-4: #799485;
  --color-5: #e3ddab;
}

SCSS

$color-1: #631b1b;
$color-2: #000000;
$color-3: #7b7844;
$color-4: #799485;
$color-5: #e3ddab;

TAILWIND

colors: {
  'brand-1': '#631b1b',
  'brand-2': '#000000',
  'brand-3': '#7b7844',
  'brand-4': '#799485',
  'brand-5': '#e3ddab',
}

RGB Array

[99, 27, 27], [0, 0, 0], [123, 120, 68], [121, 148, 133], [227, 221, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #631B1B, #000000, #7B7844, #799485, #E3DDAB is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #631b1b; --color-2: #000000; --color-3: #7b7844; --color-4: #799485; --color-5: #e3ddab. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 earth-style 5-color scheme is especially suited for finance, legal, luxury 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