← Back to Editor

#3C2628 · #553049 · #5C3854 · #7D556F · #453830

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

#3C2628

Crimson · DarkSlateGray · Deep Berry

HEX
#3C2628
RGB
rgb(60, 38, 40)
HSL
hsl(355, 22%, 19%)
HSB
hsb(355, 37%, 24%)
CMYK
cmyk(0%, 37%, 33%, 76%)
Oklch
oklch(29.7% 0.034 13.3)

TraditionalCrimson」· PaintDeep Berry」· Creative Blush Sunrise

#553049

Rose Purple · DarkSlateGray · Eggplant

HEX
#553049
RGB
rgb(85, 48, 73)
HSL
hsl(319, 28%, 26%)
HSB
hsb(319, 44%, 33%)
CMYK
cmyk(0%, 44%, 14%, 67%)
Oklch
oklch(36.5% 0.065 340.2)

TraditionalRose Purple」· PaintEggplant」· Creative Blush Sunrise

#5C3854

Rose Purple · DarkSlateGray · Eggplant

HEX
#5C3854
RGB
rgb(92, 56, 84)
HSL
hsl(313, 24%, 29%)
HSB
hsb(313, 39%, 36%)
CMYK
cmyk(0%, 39%, 9%, 64%)
Oklch
oklch(39.4% 0.066 335.3)

TraditionalRose Purple」· PaintEggplant」· Creative Blush Sunrise

#7D556F

Rose Purple · DimGray · Camellia

HEX
#7D556F
RGB
rgb(125, 85, 111)
HSL
hsl(321, 19%, 41%)
HSB
hsb(321, 32%, 49%)
CMYK
cmyk(0%, 32%, 11%, 51%)
Oklch
oklch(50.2% 0.065 340.5)

TraditionalRose Purple」· PaintCamellia」· Creative Blush Sunrise

#453830

Tangerine · DarkSlateGray · Cinnamon

HEX
#453830
RGB
rgb(69, 56, 48)
HSL
hsl(23, 18%, 23%)
HSB
hsb(23, 30%, 27%)
CMYK
cmyk(0%, 19%, 30%, 73%)
Oklch
oklch(35.2% 0.023 53.4)

TraditionalTangerine」· PaintCinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3C2628
263B39

Analogous

3B2632
3C2628
3B2F26

Triadic

3C2628
283B26
26283B

Split-Comp.

3C2628
263B2F
26323B

Tetradic

3C2628
323B26
263B39
2F263B

Contrast Matrix WCAG 2.1 Contrast

3C2628
553049
5C3854
7D556F
453830
1.3
Fail
1.4
Fail
2.3
Fail
1.2
Fail
1.3
Fail
1.1
Fail
1.8
Fail
1.0
Fail
1.4
Fail
1.1
Fail
1.6
Fail
1.2
Fail
2.3
Fail
1.8
Fail
1.6
Fail
1.8
Fail
1.2
Fail
1.0
Fail
1.2
Fail
1.8
Fail
White BG
14.0AAA
11.0AAA
9.8AAA
6.2AA
11.3AAA
Black BG
1.5Fail
1.9Fail
2.1Fail
3.4AA Large
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

323228
454543
4C4C4D
6C6B69
3F3F32

Deuteranopia

343527
474A42
4F514C
6E7167
404132

Tritanopia

3B2727
533E3D
5A4847
7B6463
443334

Achromatopsia

2D2D2D
3E3E3E
464646
646464
3B3B3B

Shades & Tints Shades & Tints

#3C2628

Dark
Light

#553049

Dark
Light

#5C3854

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3c2628;
  --color-2: #553049;
  --color-3: #5c3854;
  --color-4: #7d556f;
  --color-5: #453830;
}

SCSS

$color-1: #3c2628;
$color-2: #553049;
$color-3: #5c3854;
$color-4: #7d556f;
$color-5: #453830;

TAILWIND

colors: {
  'brand-1': '#3c2628',
  'brand-2': '#553049',
  'brand-3': '#5c3854',
  'brand-4': '#7d556f',
  'brand-5': '#453830',
}

RGB Array

[60, 38, 40], [85, 48, 73], [92, 56, 84], [125, 85, 111], [69, 56, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3C2628, #553049, #5C3854, #7D556F, #453830 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: #3c2628; --color-2: #553049; --color-3: #5c3854; --color-4: #7d556f; --color-5: #453830. 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