← Back to Editor

#EDBE4F · #D18C5A · #732331 · #7D5A55 · #8A7E5E

A 5-color palette 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

#EDBE4F

Ginger · SandyBrown · Sunflower

HEX
#EDBE4F
RGB
rgb(237, 190, 79)
HSL
hsl(42, 81%, 62%)
HSB
hsb(42, 67%, 93%)
CMYK
cmyk(0%, 20%, 67%, 7%)
Oklch
oklch(82.3% 0.137 85.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#D18C5A

Tangerine · DarkSalmon · Warm Sun

HEX
#D18C5A
RGB
rgb(209, 140, 90)
HSL
hsl(25, 56%, 59%)
HSB
hsb(25, 57%, 82%)
CMYK
cmyk(0%, 33%, 57%, 18%)
Oklch
oklch(69.9% 0.107 55.9)

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

#732331

Crimson · Brown · Wine Red

HEX
#732331
RGB
rgb(115, 35, 49)
HSL
hsl(350, 53%, 29%)
HSB
hsb(350, 70%, 45%)
CMYK
cmyk(0%, 70%, 57%, 55%)
Oklch
oklch(38.4% 0.112 13.9)

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

#7D5A55

Crimson · DimGray · Passion Red

HEX
#7D5A55
RGB
rgb(125, 90, 85)
HSL
hsl(8, 19%, 41%)
HSB
hsb(8, 32%, 49%)
CMYK
cmyk(0%, 28%, 32%, 51%)
Oklch
oklch(50.3% 0.047 28.0)

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

#8A7E5E

Ochre · Gray · Honey Gold

HEX
#8A7E5E
RGB
rgb(138, 126, 94)
HSL
hsl(44, 19%, 45%)
HSB
hsb(44, 32%, 54%)
CMYK
cmyk(0%, 9%, 32%, 46%)
Oklch
oklch(59.5% 0.048 89.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EDBE4F
507FED

Analogous

ED6F50
EDBE4F
CDED50

Triadic

EDBE4F
50EDBD
BD50ED

Split-Comp.

EDBE4F
50CDED
6F50ED

Tetradic

EDBE4F
50ED6F
507FED
ED50CD

Contrast Matrix WCAG 2.1 Contrast

EDBE4F
D18C5A
732331
7D5A55
8A7E5E
—
1.6
Fail
6.0
AA
3.5
AA Large
2.3
Fail
1.6
Fail
—
3.8
AA Large
2.2
Fail
1.5
Fail
6.0
AA
3.8
AA Large
—
1.7
Fail
2.6
Fail
3.5
AA Large
2.2
Fail
1.7
Fail
—
1.5
Fail
2.3
Fail
1.5
Fail
2.6
Fail
1.5
Fail
—
White BG
1.7Fail
2.8Fail
10.4AAA
6.1AA
4.0AA Large
Black BG
12.1AAA
7.6AAA
2.0Fail
3.5AA Large
5.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D86A
B3B366
50502E
6E6E56
858566

Deuteranopia

DBDF70
B7BC69
555B2D
707357
868668

Tritanopia

EB7F84
CE7072
6F2B2A
7B5757
896C6D

Achromatopsia

BFBFBF
9B9B9B
3D3D3D
646464
7E7E7E

Shades & Tints Shades & Tints

#EDBE4F

Dark
Light

#D18C5A

Dark
Light

#732331

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #edbe4f;
  --color-2: #d18c5a;
  --color-3: #732331;
  --color-4: #7d5a55;
  --color-5: #8a7e5e;
}

SCSS

$color-1: #edbe4f;
$color-2: #d18c5a;
$color-3: #732331;
$color-4: #7d5a55;
$color-5: #8a7e5e;

TAILWIND

colors: {
  'brand-1': '#edbe4f',
  'brand-2': '#d18c5a',
  'brand-3': '#732331',
  'brand-4': '#7d5a55',
  'brand-5': '#8a7e5e',
}

RGB Array

[237, 190, 79], [209, 140, 90], [115, 35, 49], [125, 90, 85], [138, 126, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EDBE4F, #D18C5A, #732331, #7D5A55, #8A7E5E 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: #edbe4f; --color-2: #d18c5a; --color-3: #732331; --color-4: #7d5a55; --color-5: #8a7e5e. 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 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