← Back to Editor

#B3AD77 · #957D4C · #3B1922 · #F7B98E · #D28574

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#B3AD77

Autumn Sage · Tan · Sunflower

HEX
#B3AD77
RGB
rgb(179, 173, 119)
HSL
hsl(54, 28%, 58%)
HSB
hsb(54, 34%, 70%)
CMYK
cmyk(0%, 3%, 34%, 30%)
Oklch
oklch(74.0% 0.073 102.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#957D4C

Ochre · Sienna · Honey Gold

HEX
#957D4C
RGB
rgb(149, 125, 76)
HSL
hsl(40, 32%, 44%)
HSB
hsb(40, 49%, 58%)
CMYK
cmyk(0%, 16%, 49%, 42%)
Oklch
oklch(60.1% 0.073 84.2)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#3B1922

Dark Violet · DarkSlateGray · Raspberry

HEX
#3B1922
RGB
rgb(59, 25, 34)
HSL
hsl(344, 40%, 16%)
HSB
hsb(344, 58%, 23%)
CMYK
cmyk(0%, 58%, 42%, 77%)
Oklch
oklch(26.6% 0.055 4.7)

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

#F7B98E

Apricot · BurlyWood · Peach Orange

HEX
#F7B98E
RGB
rgb(247, 185, 142)
HSL
hsl(25, 87%, 76%)
HSB
hsb(25, 43%, 97%)
CMYK
cmyk(0%, 25%, 43%, 3%)
Oklch
oklch(83.3% 0.092 55.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#D28574

Peach Pink · DarkSalmon · Coral Red

HEX
#D28574
RGB
rgb(210, 133, 116)
HSL
hsl(11, 51%, 64%)
HSB
hsb(11, 45%, 82%)
CMYK
cmyk(0%, 37%, 45%, 18%)
Oklch
oklch(69.3% 0.099 33.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3AD77
767CB2

Analogous

B28E76
B3AD77
9AB276

Triadic

B3AD77
76B2AC
AC76B2

Split-Comp.

B3AD77
769AB2
8E76B2

Tetradic

B3AD77
76B28E
767CB2
B2769A

Contrast Matrix WCAG 2.1 Contrast

B3AD77
957D4C
3B1922
F7B98E
D28574
—
1.7
Fail
6.8
AA
1.3
Fail
1.2
Fail
1.7
Fail
—
3.9
AA Large
2.3
Fail
1.4
Fail
6.8
AA
3.9
AA Large
—
9.1
AAA
5.5
AA
1.3
Fail
2.3
Fail
9.1
AAA
—
1.7
Fail
1.2
Fail
1.4
Fail
5.5
AA
1.7
Fail
—
White BG
2.3Fail
4.0AA Large
15.6AAA
1.7Fail
2.9Fail
Black BG
9.2AAA
5.3AA
1.3Fail
12.3AAA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0B084
8B8A58
2C2C20
DCDC98
B1B078

Deuteranopia

B1B187
8C8E5B
2E311F
E0E49B
B5BB79

Tritanopia

B38E91
946163
391E1E
F4A1A2
CE7B7C

Achromatopsia

A9A9A9
7F7F7F
242424
C7C7C7
9A9A9A

Shades & Tints Shades & Tints

#B3AD77

Dark
Light

#957D4C

Dark
Light

#3B1922

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3ad77;
  --color-2: #957d4c;
  --color-3: #3b1922;
  --color-4: #f7b98e;
  --color-5: #d28574;
}

SCSS

$color-1: #b3ad77;
$color-2: #957d4c;
$color-3: #3b1922;
$color-4: #f7b98e;
$color-5: #d28574;

TAILWIND

colors: {
  'brand-1': '#b3ad77',
  'brand-2': '#957d4c',
  'brand-3': '#3b1922',
  'brand-4': '#f7b98e',
  'brand-5': '#d28574',
}

RGB Array

[179, 173, 119], [149, 125, 76], [59, 25, 34], [247, 185, 142], [210, 133, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3AD77, #957D4C, #3B1922, #F7B98E, #D28574 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #b3ad77; --color-2: #957d4c; --color-3: #3b1922; --color-4: #f7b98e; --color-5: #d28574. 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. 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 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