#5B5C49 + #E91C82 + #DEB031 + #AFB507 + #8E8F6D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#5B5C49

Autumn Sage · DarkOliveGreen · Honey Gold

HEX

#5B5C49

RGB

rgb(91, 92, 73)

HSL

hsl(63, 12%, 32%)

HSB

hsb(63, 21%, 36%)

CMYK

cmyk(1%, 0%, 21%, 64%)

Oklch

oklch(46.8% 0.029 110.0)

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

#E91C82

Dark Violet · DeepPink · Rose Pink

HEX

#E91C82

RGB

rgb(233, 28, 130)

HSL

hsl(330, 82%, 51%)

HSB

hsb(330, 88%, 91%)

CMYK

cmyk(0%, 88%, 44%, 9%)

Oklch

oklch(61.4% 0.238 358.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#DEB031

Ginger · GoldenRod · Sunflower

HEX

#DEB031

RGB

rgb(222, 176, 49)

HSL

hsl(44, 72%, 53%)

HSB

hsb(44, 78%, 87%)

CMYK

cmyk(0%, 21%, 78%, 13%)

Oklch

oklch(77.8% 0.145 87.4)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#AFB507

Autumn Sage · DarkGoldenRod · Honey Gold

HEX

#AFB507

RGB

rgb(175, 181, 7)

HSL

hsl(62, 93%, 37%)

HSB

hsb(62, 96%, 71%)

CMYK

cmyk(3%, 0%, 96%, 29%)

Oklch

oklch(74.3% 0.164 112.2)

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

#8E8F6D

Autumn Sage · Gray · Honey Gold

HEX

#8E8F6D

RGB

rgb(142, 143, 109)

HSL

hsl(62, 13%, 49%)

HSB

hsb(62, 24%, 56%)

CMYK

cmyk(1%, 0%, 24%, 44%)

Oklch

oklch(64.0% 0.048 109.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5B5C49

49485B

Analogous

5B5348

5B5C49

515B48

Triadic

5B5C49

485A5B

5B485A

Split-Comp.

5B5C49

48515B

53485B

Tetradic

5B5C49

485B53

49485B

5B4851

Contrast Matrix WCAG 2.1 Contrast

5B5C49	E91C82	DEB031	AFB507	8E8F6D
—	1.6 Fail	3.4 AA Large	3.1 AA Large	2.1 Fail
1.6 Fail	—	2.1 Fail	1.9 Fail	1.3 Fail
3.4 AA Large	2.1 Fail	—	1.1 Fail	1.6 Fail
3.1 AA Large	1.9 Fail	1.1 Fail	—	1.5 Fail
2.1 Fail	1.3 Fail	1.6 Fail	1.5 Fail	—

White BG

6.8AA

4.2AA Large

2.0Fail

2.2Fail

3.3AA Large

Black BG

3.1AA Large

5.0AA

10.4AAA

9.4AAA

6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5B4E

908E69

CACA50

B2B231

8E8E75

Deuteranopia

5B5B4F

9CAC63

CDD057

B1B13B

8E8E77

Tritanopia

5B5152

DF5652

DC686D

AF525A

8E7C7D

Achromatopsia

5A5A5A

656565

AFAFAF

9F9F9F

8B8B8B

Shades & Tints Shades & Tints

#5B5C49

Dark

Light

#E91C82

Dark

Light

#DEB031

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5b5c49;
  --color-2: #e91c82;
  --color-3: #deb031;
  --color-4: #afb507;
  --color-5: #8e8f6d;
}

SCSS

$color-1: #5b5c49;
$color-2: #e91c82;
$color-3: #deb031;
$color-4: #afb507;
$color-5: #8e8f6d;

TAILWIND

colors: {
  'brand-1': '#5b5c49',
  'brand-2': '#e91c82',
  'brand-3': '#deb031',
  'brand-4': '#afb507',
  'brand-5': '#8e8f6d',
}

RGB Array

[91, 92, 73], [233, 28, 130], [222, 176, 49], [175, 181, 7], [142, 143, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5B5C49, #E91C82, #DEB031, #AFB507, #8E8F6D 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: #5b5c49; --color-2: #e91c82; --color-3: #deb031; --color-4: #afb507; --color-5: #8e8f6d. 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