← Back to Editor

#473C37 · #5E453D · #784956 · #98485E · #BB4967

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 ThemeCorporate

Color Details Color Details

#473C37

Tangerine · DarkSlateGray · Cinnamon

HEX
#473C37
RGB
rgb(71, 60, 55)
HSL
hsl(19, 13%, 25%)
HSB
hsb(19, 23%, 28%)
CMYK
cmyk(0%, 15%, 23%, 72%)
Oklch
oklch(36.6% 0.018 45.9)

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

#5E453D

Tangerine · DarkOliveGreen · Amber Brown

HEX
#5E453D
RGB
rgb(94, 69, 61)
HSL
hsl(15, 21%, 30%)
HSB
hsb(15, 35%, 37%)
CMYK
cmyk(0%, 27%, 35%, 63%)
Oklch
oklch(41.5% 0.037 38.5)

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

#784956

Dark Violet · DimGray · Camellia

HEX
#784956
RGB
rgb(120, 73, 86)
HSL
hsl(343, 24%, 38%)
HSB
hsb(343, 39%, 47%)
CMYK
cmyk(0%, 39%, 28%, 53%)
Oklch
oklch(46.4% 0.066 2.1)

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

#98485E

Dark Violet · Sienna · Camellia

HEX
#98485E
RGB
rgb(152, 72, 94)
HSL
hsl(344, 36%, 44%)
HSB
hsb(344, 53%, 60%)
CMYK
cmyk(0%, 53%, 38%, 40%)
Oklch
oklch(50.9% 0.109 4.4)

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

#BB4967

Dark Violet · MediumVioletRed · Rose Pink

HEX
#BB4967
RGB
rgb(187, 73, 103)
HSL
hsl(344, 46%, 51%)
HSB
hsb(344, 61%, 73%)
CMYK
cmyk(0%, 61%, 45%, 27%)
Oklch
oklch(56.5% 0.149 6.9)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

473C37
374348

Analogous

48373B
473C37
484537

Triadic

473C37
37483D
3D3748

Split-Comp.

473C37
374845
373B48

Tetradic

473C37
3B4837
374348
453748

Contrast Matrix WCAG 2.1 Contrast

473C37
5E453D
784956
98485E
BB4967
—
1.2
Fail
1.5
Fail
1.7
Fail
2.2
Fail
1.2
Fail
—
1.2
Fail
1.4
Fail
1.8
Fail
1.5
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
1.7
Fail
1.4
Fail
1.2
Fail
—
1.2
Fail
2.2
Fail
1.8
Fail
1.5
Fail
1.2
Fail
—
White BG
10.7AAA
8.8AAA
7.3AAA
6.1AA
4.9AA
Black BG
2.0Fail
2.4Fail
2.9Fail
3.4AA Large
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

424238
53533F
646353
757559
8A8960

Deuteranopia

434439
55573F
666A52
7A8057
90995E

Tritanopia

463939
5D4041
765050
945454
B55A59

Achromatopsia

3F3F3F
4C4C4C
595959
626262
6F6F6F

Shades & Tints Shades & Tints

#473C37

Dark
Light

#5E453D

Dark
Light

#784956

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #473c37;
  --color-2: #5e453d;
  --color-3: #784956;
  --color-4: #98485e;
  --color-5: #bb4967;
}

SCSS

$color-1: #473c37;
$color-2: #5e453d;
$color-3: #784956;
$color-4: #98485e;
$color-5: #bb4967;

TAILWIND

colors: {
  'brand-1': '#473c37',
  'brand-2': '#5e453d',
  'brand-3': '#784956',
  'brand-4': '#98485e',
  'brand-5': '#bb4967',
}

RGB Array

[71, 60, 55], [94, 69, 61], [120, 73, 86], [152, 72, 94], [187, 73, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #473C37, #5E453D, #784956, #98485E, #BB4967 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. 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: #473c37; --color-2: #5e453d; --color-3: #784956; --color-4: #98485e; --color-5: #bb4967. 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. 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