← Back to Editor

#4D3E4D · #BD3A57 · #BA7F32 · #BDBA35 · #5CAD91

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

#4D3E4D

Rose Purple · DarkSlateGray · Eggplant

HEX
#4D3E4D
RGB
rgb(77, 62, 77)
HSL
hsl(300, 11%, 27%)
HSB
hsb(300, 19%, 30%)
CMYK
cmyk(0%, 19%, 0%, 70%)
Oklch
oklch(38.5% 0.032 326.2)

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

#BD3A57

Crimson · Brown · Passion Red

HEX
#BD3A57
RGB
rgb(189, 58, 87)
HSL
hsl(347, 53%, 48%)
HSB
hsb(347, 69%, 74%)
CMYK
cmyk(0%, 69%, 54%, 26%)
Oklch
oklch(54.7% 0.167 11.6)

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

#BA7F32

Ochre · Chocolate · Amber Brown

HEX
#BA7F32
RGB
rgb(186, 127, 50)
HSL
hsl(34, 58%, 46%)
HSB
hsb(34, 73%, 73%)
CMYK
cmyk(0%, 32%, 73%, 27%)
Oklch
oklch(64.3% 0.117 69.8)

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

#BDBA35

Autumn Sage · GoldenRod · Honey Gold

HEX
#BDBA35
RGB
rgb(189, 186, 53)
HSL
hsl(59, 56%, 47%)
HSB
hsb(59, 72%, 74%)
CMYK
cmyk(0%, 2%, 72%, 26%)
Oklch
oklch(76.8% 0.148 108.1)

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

#5CAD91

Mineral Blue · CadetBlue · Olive Green

HEX
#5CAD91
RGB
rgb(92, 173, 145)
HSL
hsl(159, 33%, 52%)
HSB
hsb(159, 47%, 68%)
CMYK
cmyk(47%, 0%, 16%, 32%)
Oklch
oklch(68.8% 0.091 169.0)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4D3E4D
3D4C3D

Analogous

453D4C
4D3E4D
4C3D45

Triadic

4D3E4D
4C4C3D
3D4C4C

Split-Comp.

4D3E4D
454C3D
3D4C45

Tetradic

4D3E4D
4C453D
3D4C3D
3D454C

Contrast Matrix WCAG 2.1 Contrast

4D3E4D
BD3A57
BA7F32
BDBA35
5CAD91
—
1.8
Fail
2.9
Fail
4.8
AA
3.7
AA Large
1.8
Fail
—
1.6
Fail
2.6
Fail
2.0
Fail
2.9
Fail
1.6
Fail
—
1.7
Fail
1.3
Fail
4.8
AA
2.6
Fail
1.7
Fail
—
1.3
Fail
3.7
AA Large
2.0
Fail
1.3
Fail
1.3
Fail
—
White BG
9.9AAA
5.4AA
3.4AA Large
2.1Fail
2.7Fail
Black BG
2.1Fail
3.9AA Large
6.2AA
10.2AAA
7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

474649
848350
A0A045
BCBC55
7F8098

Deuteranopia

474949
8C964E
A4A849
BCBC5D
7A7499

Tritanopia

4C4746
B64A49
B75357
BD6F74
609D9E

Achromatopsia

444444
646464
888888
ACACAC
929292

Shades & Tints Shades & Tints

#4D3E4D

Dark
Light

#BD3A57

Dark
Light

#BA7F32

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4d3e4d;
  --color-2: #bd3a57;
  --color-3: #ba7f32;
  --color-4: #bdba35;
  --color-5: #5cad91;
}

SCSS

$color-1: #4d3e4d;
$color-2: #bd3a57;
$color-3: #ba7f32;
$color-4: #bdba35;
$color-5: #5cad91;

TAILWIND

colors: {
  'brand-1': '#4d3e4d',
  'brand-2': '#bd3a57',
  'brand-3': '#ba7f32',
  'brand-4': '#bdba35',
  'brand-5': '#5cad91',
}

RGB Array

[77, 62, 77], [189, 58, 87], [186, 127, 50], [189, 186, 53], [92, 173, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4D3E4D, #BD3A57, #BA7F32, #BDBA35, #5CAD91 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: #4d3e4d; --color-2: #bd3a57; --color-3: #ba7f32; --color-4: #bdba35; --color-5: #5cad91. 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