#E0833D + #AD7E2C + #897038 + #5F5937 + #2B492D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#E0833D

Tangerine · Coral · Warm Sun

HEX

#E0833D

RGB

rgb(224, 131, 61)

HSL

hsl(26, 72%, 56%)

HSB

hsb(26, 73%, 88%)

CMYK

cmyk(0%, 42%, 73%, 12%)

Oklch

oklch(69.8% 0.142 54.6)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#AD7E2C

Ochre · DarkGoldenRod · Amber Brown

HEX

#AD7E2C

RGB

rgb(173, 126, 44)

HSL

hsl(38, 59%, 43%)

HSB

hsb(38, 75%, 68%)

CMYK

cmyk(0%, 27%, 75%, 32%)

Oklch

oklch(62.5% 0.112 77.5)

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

#897038

Ochre · Sienna · Honey Gold

HEX

#897038

RGB

rgb(137, 112, 56)

HSL

hsl(41, 42%, 38%)

HSB

hsb(41, 59%, 54%)

CMYK

cmyk(0%, 18%, 59%, 46%)

Oklch

oklch(55.7% 0.081 85.6)

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

#5F5937

Autumn Sage · DarkOliveGreen · Honey Gold

HEX

#5F5937

RGB

rgb(95, 89, 55)

HSL

hsl(51, 27%, 29%)

HSB

hsb(51, 42%, 37%)

CMYK

cmyk(0%, 6%, 42%, 63%)

Oklch

oklch(46.1% 0.051 99.5)

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

#2B492D

Celadon · DarkSlateGray · Forest Green

HEX

#2B492D

RGB

rgb(43, 73, 45)

HSL

hsl(124, 26%, 23%)

HSB

hsb(124, 41%, 29%)

CMYK

cmyk(41%, 0%, 38%, 71%)

Oklch

oklch(37.3% 0.059 145.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0833D

3E9AE0

Analogous

E03E49

E0833D

E0D53E

Triadic

E0833D

3EE084

843EE0

Split-Comp.

E0833D

3EE0D5

3E49E0

Tetradic

E0833D

49E03E

3E9AE0

D53EE0

Contrast Matrix WCAG 2.1 Contrast

E0833D	AD7E2C	897038	5F5937	2B492D
—	1.3 Fail	1.7 Fail	2.5 Fail	3.6 AA Large
1.3 Fail	—	1.3 Fail	2.0 Fail	2.8 Fail
1.7 Fail	1.3 Fail	—	1.5 Fail	2.1 Fail
2.5 Fail	2.0 Fail	1.5 Fail	—	1.4 Fail
3.6 AA Large	2.8 Fail	2.1 Fail	1.4 Fail	—

White BG

2.8Fail

3.6AA Large

4.7AA

7.1AAA

10.0AAA

Black BG

7.5AAA

5.8AA

4.4AA Large

3.0Fail

2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B74E

999840

7E7E46

5C5C3F

383834

Deuteranopia

BDC452

9B9F45

808249

5D5D41

363435

Tritanopia

DB5B5E

AB5053

885053

5F4647

2D393A

Achromatopsia

979797

838383

717171

575757

3D3D3D

Shades & Tints Shades & Tints

#E0833D

Dark

Light

#AD7E2C

Dark

Light

#897038

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0833d;
  --color-2: #ad7e2c;
  --color-3: #897038;
  --color-4: #5f5937;
  --color-5: #2b492d;
}

SCSS

$color-1: #e0833d;
$color-2: #ad7e2c;
$color-3: #897038;
$color-4: #5f5937;
$color-5: #2b492d;

TAILWIND

colors: {
  'brand-1': '#e0833d',
  'brand-2': '#ad7e2c',
  'brand-3': '#897038',
  'brand-4': '#5f5937',
  'brand-5': '#2b492d',
}

RGB Array

[224, 131, 61], [173, 126, 44], [137, 112, 56], [95, 89, 55], [43, 73, 45]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E0833D, #AD7E2C, #897038, #5F5937, #2B492D 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: #e0833d; --color-2: #ad7e2c; --color-3: #897038; --color-4: #5f5937; --color-5: #2b492d. 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 general-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