← Back to Editor

#542536 · #B8AC8A · #447867 · #89915A · #B3A272

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

#542536

Dark Violet · DarkSlateGray · Raspberry

HEX
#542536
RGB
rgb(84, 37, 54)
HSL
hsl(338, 39%, 24%)
HSB
hsb(338, 56%, 33%)
CMYK
cmyk(0%, 56%, 36%, 67%)
Oklch
oklch(33.6% 0.073 358.9)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#B8AC8A

Ginger · Tan · Sunflower

HEX
#B8AC8A
RGB
rgb(184, 172, 138)
HSL
hsl(44, 24%, 63%)
HSB
hsb(44, 25%, 72%)
CMYK
cmyk(0%, 7%, 25%, 28%)
Oklch
oklch(74.6% 0.049 90.9)

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

#447867

Mineral Blue · SeaGreen · Mint Ice

HEX
#447867
RGB
rgb(68, 120, 103)
HSL
hsl(160, 28%, 37%)
HSB
hsb(160, 43%, 47%)
CMYK
cmyk(43%, 0%, 14%, 53%)
Oklch
oklch(53.1% 0.063 170.8)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#89915A

Autumn Sage · Gray · Honey Gold

HEX
#89915A
RGB
rgb(137, 145, 90)
HSL
hsl(69, 23%, 46%)
HSB
hsb(69, 38%, 57%)
CMYK
cmyk(6%, 0%, 38%, 43%)
Oklch
oklch(63.7% 0.077 115.4)

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

#B3A272

Ginger · Tan · Sunflower

HEX
#B3A272
RGB
rgb(179, 162, 114)
HSL
hsl(44, 30%, 57%)
HSB
hsb(44, 36%, 70%)
CMYK
cmyk(0%, 9%, 36%, 30%)
Oklch
oklch(71.5% 0.068 90.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

542536
255544

Analogous

55254F
542536
552C25

Triadic

542536
375525
253755

Split-Comp.

542536
25552C
254F55

Tetradic

542536
4F5525
255544
2C2555

Contrast Matrix WCAG 2.1 Contrast

542536
B8AC8A
447867
89915A
B3A272
—
5.5
AA
2.4
Fail
3.7
AA Large
4.9
AA
5.5
AA
—
2.3
Fail
1.5
Fail
1.1
Fail
2.4
Fail
2.3
Fail
—
1.5
Fail
2.0
Fail
3.7
AA Large
1.5
Fail
1.5
Fail
—
1.3
Fail
4.9
AA
1.1
Fail
2.0
Fail
1.3
Fail
—
White BG
12.4AAA
2.3Fail
5.1AA
3.4AA Large
2.5Fail
Black BG
1.7Fail
9.3AAA
4.1AA Large
6.3AA
8.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

403F32
B3B392
5B5B6B
8C8D67
ACAB7E

Deuteranopia

424631
B4B494
58546C
8C8B6B
ADAE80

Tritanopia

522F2E
B7999A
476E6F
897274
B28789

Achromatopsia

353535
ACACAC
676767
888888
A2A2A2

Shades & Tints Shades & Tints

#542536

Dark
Light

#B8AC8A

Dark
Light

#447867

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #542536;
  --color-2: #b8ac8a;
  --color-3: #447867;
  --color-4: #89915a;
  --color-5: #b3a272;
}

SCSS

$color-1: #542536;
$color-2: #b8ac8a;
$color-3: #447867;
$color-4: #89915a;
$color-5: #b3a272;

TAILWIND

colors: {
  'brand-1': '#542536',
  'brand-2': '#b8ac8a',
  'brand-3': '#447867',
  'brand-4': '#89915a',
  'brand-5': '#b3a272',
}

RGB Array

[84, 37, 54], [184, 172, 138], [68, 120, 103], [137, 145, 90], [179, 162, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #542536, #B8AC8A, #447867, #89915A, #B3A272 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #542536; --color-2: #b8ac8a; --color-3: #447867; --color-4: #89915a; --color-5: #b3a272. 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. Restrained colors convey professionalism and trust. 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