#6B654F + #8D4F36 + #802729 + #4B2125 + #1E121C · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#6B654F

Ochre · DimGray · Honey Gold

HEX

#6B654F

RGB

rgb(107, 101, 79)

HSL

hsl(47, 15%, 36%)

HSB

hsb(47, 26%, 42%)

CMYK

cmyk(0%, 6%, 26%, 58%)

Oklch

oklch(50.6% 0.034 94.6)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#8D4F36

Tangerine · Sienna · Amber Brown

HEX

#8D4F36

RGB

rgb(141, 79, 54)

HSL

hsl(17, 45%, 38%)

HSB

hsb(17, 62%, 55%)

CMYK

cmyk(0%, 44%, 62%, 45%)

Oklch

oklch(49.5% 0.092 42.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#802729

Crimson · Brown · Wine Red

HEX

#802729

RGB

rgb(128, 39, 41)

HSL

hsl(359, 53%, 33%)

HSB

hsb(359, 70%, 50%)

CMYK

cmyk(0%, 70%, 68%, 50%)

Oklch

oklch(41.1% 0.123 23.1)

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

#4B2125

Crimson · DarkSlateGray · Wine Red

HEX

#4B2125

RGB

rgb(75, 33, 37)

HSL

hsl(354, 39%, 21%)

HSB

hsb(354, 56%, 29%)

CMYK

cmyk(0%, 56%, 51%, 71%)

Oklch

oklch(30.8% 0.064 15.6)

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

#1E121C

Rose Purple · Black · Dark Purple

HEX

#1E121C

RGB

rgb(30, 18, 28)

HSL

hsl(310, 25%, 9%)

HSB

hsb(310, 40%, 12%)

CMYK

cmyk(0%, 40%, 7%, 88%)

Oklch

oklch(20.3% 0.027 332.5)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6B654F

4E546A

Analogous

6A564E

6B654F

626A4E

Triadic

6B654F

4E6A64

644E6A

Split-Comp.

6B654F

4E626A

564E6A

Tetradic

6B654F

4E6A56

4E546A

6A4E62

Contrast Matrix WCAG 2.1 Contrast

6B654F	8D4F36	802729	4B2125	1E121C
—	1.1 Fail	1.6 Fail	2.3 Fail	3.1 AA Large
1.1 Fail	—	1.5 Fail	2.1 Fail	2.9 Fail
1.6 Fail	1.5 Fail	—	1.5 Fail	1.9 Fail
2.3 Fail	2.1 Fail	1.5 Fail	—	1.3 Fail
3.1 AA Large	2.9 Fail	1.9 Fail	1.3 Fail	—

White BG

5.8AA

6.4AA

9.4AAA

13.6AAA

18.1AAA

Black BG

3.6AA Large

3.3AA Large

2.2Fail

1.5Fail

1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

686854

72723C

595929

393824

19191A

Deuteranopia

696956

767A3E

5F6528

3B3E24

1A1A19

Tritanopia

6B5959

8A4142

7C2828

492323

1D1817

Achromatopsia

646464

5F5F5F

424242

2E2E2E

171717

Shades & Tints Shades & Tints

#6B654F

Dark

Light

#8D4F36

Dark

Light

#802729

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6b654f;
  --color-2: #8d4f36;
  --color-3: #802729;
  --color-4: #4b2125;
  --color-5: #1e121c;
}

SCSS

$color-1: #6b654f;
$color-2: #8d4f36;
$color-3: #802729;
$color-4: #4b2125;
$color-5: #1e121c;

TAILWIND

colors: {
  'brand-1': '#6b654f',
  'brand-2': '#8d4f36',
  'brand-3': '#802729',
  'brand-4': '#4b2125',
  'brand-5': '#1e121c',
}

RGB Array

[107, 101, 79], [141, 79, 54], [128, 39, 41], [75, 33, 37], [30, 18, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #6B654F, #8D4F36, #802729, #4B2125, #1E121C is ideal for: tech websites, dark mode UIs, game UIs. 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: #6b654f; --color-2: #8d4f36; --color-3: #802729; --color-4: #4b2125; --color-5: #1e121c. 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. 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