← Back to Editor

#435247 · #BFBD82 · #9C7D5C · #893A2E · #3D282A

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#435247

Celadon · DarkSlateGray · Forest Green

HEX
#435247
RGB
rgb(67, 82, 71)
HSL
hsl(136, 10%, 29%)
HSB
hsb(136, 18%, 32%)
CMYK
cmyk(18%, 0%, 13%, 68%)
Oklch
oklch(42.2% 0.026 153.4)

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

#BFBD82

Fresh Green · Tan · Sunflower

HEX
#BFBD82
RGB
rgb(191, 189, 130)
HSL
hsl(58, 32%, 63%)
HSB
hsb(58, 32%, 75%)
CMYK
cmyk(0%, 1%, 32%, 25%)
Oklch
oklch(78.6% 0.078 106.4)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#9C7D5C

Ochre · Gray · Amber Brown

HEX
#9C7D5C
RGB
rgb(156, 125, 92)
HSL
hsl(31, 26%, 49%)
HSB
hsb(31, 41%, 61%)
CMYK
cmyk(0%, 20%, 41%, 39%)
Oklch
oklch(61.1% 0.060 68.1)

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

#893A2E

Crimson · Brown · Wine Red

HEX
#893A2E
RGB
rgb(137, 58, 46)
HSL
hsl(8, 50%, 36%)
HSB
hsb(8, 66%, 54%)
CMYK
cmyk(0%, 58%, 66%, 46%)
Oklch
oklch(45.3% 0.111 30.6)

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

#3D282A

Crimson · DarkSlateGray · Deep Berry

HEX
#3D282A
RGB
rgb(61, 40, 42)
HSL
hsl(354, 21%, 20%)
HSB
hsb(354, 34%, 24%)
CMYK
cmyk(0%, 34%, 31%, 76%)
Oklch
oklch(30.3% 0.032 12.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

435247
51434D

Analogous

465143
435247
43514E

Triadic

435247
464351
514643

Split-Comp.

435247
4E4351
514346

Tetradic

435247
434651
51434D
514E43

Contrast Matrix WCAG 2.1 Contrast

435247
BFBD82
9C7D5C
893A2E
3D282A
—
4.3
AA Large
2.2
Fail
1.1
Fail
1.7
Fail
4.3
AA Large
—
2.0
Fail
4.0
AA Large
7.0
AAA
2.2
Fail
2.0
Fail
—
2.0
Fail
3.6
AA Large
1.1
Fail
4.0
AA Large
2.0
Fail
—
1.8
Fail
1.7
Fail
7.0
AAA
3.6
AA Large
1.8
Fail
—
White BG
8.3AAA
1.9Fail
3.8AA Large
7.8AAA
13.7AAA
Black BG
2.5Fail
10.8AAA
5.5AA
2.7Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

494A4A
BEBE90
8F8E64
676631
34342A

Deuteranopia

49484A
BEBE94
909366
6B7132
353729

Tritanopia

444C4C
BF9C9E
9A6A6C
853334
3C2929

Achromatopsia

4C4C4C
B7B7B7
838383
505050
2F2F2F

Shades & Tints Shades & Tints

#435247

Dark
Light

#BFBD82

Dark
Light

#9C7D5C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #435247;
  --color-2: #bfbd82;
  --color-3: #9c7d5c;
  --color-4: #893a2e;
  --color-5: #3d282a;
}

SCSS

$color-1: #435247;
$color-2: #bfbd82;
$color-3: #9c7d5c;
$color-4: #893a2e;
$color-5: #3d282a;

TAILWIND

colors: {
  'brand-1': '#435247',
  'brand-2': '#bfbd82',
  'brand-3': '#9c7d5c',
  'brand-4': '#893a2e',
  'brand-5': '#3d282a',
}

RGB Array

[67, 82, 71], [191, 189, 130], [156, 125, 92], [137, 58, 46], [61, 40, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #435247, #BFBD82, #9C7D5C, #893A2E, #3D282A is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #435247; --color-2: #bfbd82; --color-3: #9c7d5c; --color-4: #893a2e; --color-5: #3d282a. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 finance, legal, luxury 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