← Back to Editor

#B49E65 · #B08157 · #905454 · #644B51 · #333E40

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

#B49E65

Ginger · Tan · Sunflower

HEX
#B49E65
RGB
rgb(180, 158, 101)
HSL
hsl(43, 34%, 55%)
HSB
hsb(43, 44%, 71%)
CMYK
cmyk(0%, 12%, 44%, 29%)
Oklch
oklch(70.6% 0.080 89.2)

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

#B08157

Tangerine · Gray · Warm Sun

HEX
#B08157
RGB
rgb(176, 129, 87)
HSL
hsl(28, 36%, 52%)
HSB
hsb(28, 51%, 69%)
CMYK
cmyk(0%, 27%, 51%, 31%)
Oklch
oklch(64.0% 0.082 62.3)

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

#905454

Crimson · Sienna · Passion Red

HEX
#905454
RGB
rgb(144, 84, 84)
HSL
hsl(0, 26%, 45%)
HSB
hsb(0, 42%, 56%)
CMYK
cmyk(0%, 42%, 42%, 44%)
Oklch
oklch(51.5% 0.080 20.2)

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

#644B51

Crimson · DimGray · Wine Red

HEX
#644B51
RGB
rgb(100, 75, 81)
HSL
hsl(346, 14%, 34%)
HSB
hsb(346, 25%, 39%)
CMYK
cmyk(0%, 25%, 19%, 61%)
Oklch
oklch(44.1% 0.035 2.7)

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

#333E40

Slate Blue · DarkSlateGray · Peacock Green

HEX
#333E40
RGB
rgb(51, 62, 64)
HSL
hsl(189, 11%, 23%)
HSB
hsb(189, 20%, 25%)
CMYK
cmyk(20%, 3%, 0%, 75%)
Oklch
oklch(35.5% 0.015 209.8)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B49E65
657BB3

Analogous

B37665
B49E65
A2B365

Triadic

B49E65
65B39D
9D65B3

Split-Comp.

B49E65
65A2B3
7665B3

Tetradic

B49E65
65B376
657BB3
B365A2

Contrast Matrix WCAG 2.1 Contrast

B49E65
B08157
905454
644B51
333E40
—
1.3
Fail
2.2
Fail
3.0
AA Large
4.2
AA Large
1.3
Fail
—
1.7
Fail
2.3
Fail
3.2
AA Large
2.2
Fail
1.7
Fail
—
1.3
Fail
1.9
Fail
3.0
AA Large
2.3
Fail
1.3
Fail
—
1.4
Fail
4.2
AA Large
3.2
AA Large
1.9
Fail
1.4
Fail
—
White BG
2.6Fail
3.4AA Large
5.9AA
7.9AAA
11.0AAA
Black BG
8.0AAA
6.1AA
3.6AA Large
2.7Fail
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAAA73
9C9B61
767554
595950
383840

Deuteranopia

ACAD76
9EA264
7A7E54
5B5D4F
37363F

Tritanopia

B37E80
AE696B
8D5454
634E4E
343F3F

Achromatopsia

9E9E9E
8A8A8A
666666
535353
3B3B3B

Shades & Tints Shades & Tints

#B49E65

Dark
Light

#B08157

Dark
Light

#905454

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b49e65;
  --color-2: #b08157;
  --color-3: #905454;
  --color-4: #644b51;
  --color-5: #333e40;
}

SCSS

$color-1: #b49e65;
$color-2: #b08157;
$color-3: #905454;
$color-4: #644b51;
$color-5: #333e40;

TAILWIND

colors: {
  'brand-1': '#b49e65',
  'brand-2': '#b08157',
  'brand-3': '#905454',
  'brand-4': '#644b51',
  'brand-5': '#333e40',
}

RGB Array

[180, 158, 101], [176, 129, 87], [144, 84, 84], [100, 75, 81], [51, 62, 64]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B49E65, #B08157, #905454, #644B51, #333E40 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: #b49e65; --color-2: #b08157; --color-3: #905454; --color-4: #644b51; --color-5: #333e40. 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