← Back to Editor

#473A32 · #8B4C61 · #FB8D6C · #EDE698 · #FBF7EB

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

#473A32

Tangerine · DarkSlateGray · Cinnamon

HEX
#473A32
RGB
rgb(71, 58, 50)
HSL
hsl(23, 17%, 24%)
HSB
hsb(23, 30%, 28%)
CMYK
cmyk(0%, 18%, 30%, 72%)
Oklch
oklch(36.0% 0.023 53.4)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#8B4C61

Dark Violet · DimGray · Camellia

HEX
#8B4C61
RGB
rgb(139, 76, 97)
HSL
hsl(340, 29%, 42%)
HSB
hsb(340, 45%, 55%)
CMYK
cmyk(0%, 45%, 30%, 45%)
Oklch
oklch(49.8% 0.088 359.5)

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

#FB8D6C

Peach Pink · Salmon · Coral Red

HEX
#FB8D6C
RGB
rgb(251, 141, 108)
HSL
hsl(14, 95%, 70%)
HSB
hsb(14, 57%, 98%)
CMYK
cmyk(0%, 44%, 57%, 2%)
Oklch
oklch(75.5% 0.142 37.5)

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

#EDE698

Fresh Green · Khaki · Lemon Cream

HEX
#EDE698
RGB
rgb(237, 230, 152)
HSL
hsl(55, 70%, 76%)
HSB
hsb(55, 36%, 93%)
CMYK
cmyk(0%, 3%, 36%, 7%)
Oklch
oklch(91.3% 0.099 103.8)

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

#FBF7EB

Goose Yellow · SeaShell · Lemon Cream

HEX
#FBF7EB
RGB
rgb(251, 247, 235)
HSL
hsl(45, 67%, 95%)
HSB
hsb(45, 6%, 98%)
CMYK
cmyk(0%, 2%, 6%, 2%)
Oklch
oklch(97.6% 0.016 91.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

473A32
334048

Analogous

483335
473A32
484533

Triadic

473A32
33483B
3B3348

Split-Comp.

473A32
334845
333548

Tetradic

473A32
354833
334048
453348

Contrast Matrix WCAG 2.1 Contrast

473A32
8B4C61
FB8D6C
EDE698
FBF7EB
—
1.7
Fail
4.8
AA
8.5
AAA
10.2
AAA
1.7
Fail
—
2.8
Fail
5.0
AA
5.9
AA
4.8
AA
2.8
Fail
—
1.8
Fail
2.1
Fail
8.5
AAA
5.0
AA
1.8
Fail
—
1.2
Fail
10.2
AAA
5.9
AA
2.1
Fail
1.2
Fail
—
White BG
10.9AAA
6.4AA
2.3Fail
1.3Fail
1.1Fail
Black BG
1.9Fail
3.3AA Large
9.1AAA
16.4AAA
19.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

414134
706F5C
CBCA74
EAEAAB
F9F9EE

Deuteranopia

424334
73785B
D2DA76
EAEBAF
FAFAEF

Tritanopia

463536
885857
F67A7C
EDBABD
FBF0F1

Achromatopsia

3D3D3D
616161
AAAAAA
DFDFDF
F7F7F7

Shades & Tints Shades & Tints

#473A32

Dark
Light

#8B4C61

Dark
Light

#FB8D6C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #473a32;
  --color-2: #8b4c61;
  --color-3: #fb8d6c;
  --color-4: #ede698;
  --color-5: #fbf7eb;
}

SCSS

$color-1: #473a32;
$color-2: #8b4c61;
$color-3: #fb8d6c;
$color-4: #ede698;
$color-5: #fbf7eb;

TAILWIND

colors: {
  'brand-1': '#473a32',
  'brand-2': '#8b4c61',
  'brand-3': '#fb8d6c',
  'brand-4': '#ede698',
  'brand-5': '#fbf7eb',
}

RGB Array

[71, 58, 50], [139, 76, 97], [251, 141, 108], [237, 230, 152], [251, 247, 235]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #473A32, #8B4C61, #FB8D6C, #EDE698, #FBF7EB 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: #473a32; --color-2: #8b4c61; --color-3: #fb8d6c; --color-4: #ede698; --color-5: #fbf7eb. 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