← Back to Editor

#201F35 · #343041 · #5B4143 · #945B44 · #C77F48

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#201F35

Deep Indigo · DarkSlateGray · Deep Sea Blue

HEX
#201F35
RGB
rgb(32, 31, 53)
HSL
hsl(243, 26%, 16%)
HSB
hsb(243, 42%, 21%)
CMYK
cmyk(40%, 42%, 0%, 79%)
Oklch
oklch(25.2% 0.041 285.1)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#343041

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#343041
RGB
rgb(52, 48, 65)
HSL
hsl(254, 15%, 22%)
HSB
hsb(254, 26%, 25%)
CMYK
cmyk(20%, 26%, 0%, 75%)
Oklch
oklch(32.1% 0.030 295.4)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#5B4143

Crimson · DarkOliveGreen · Wine Red

HEX
#5B4143
RGB
rgb(91, 65, 67)
HSL
hsl(355, 17%, 31%)
HSB
hsb(355, 29%, 36%)
CMYK
cmyk(0%, 29%, 26%, 64%)
Oklch
oklch(40.5% 0.036 13.7)

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

#945B44

Tangerine · Sienna · Amber Brown

HEX
#945B44
RGB
rgb(148, 91, 68)
HSL
hsl(17, 37%, 42%)
HSB
hsb(17, 54%, 58%)
CMYK
cmyk(0%, 39%, 54%, 42%)
Oklch
oklch(52.9% 0.083 42.6)

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

#C77F48

Tangerine · Chocolate · Warm Sun

HEX
#C77F48
RGB
rgb(199, 127, 72)
HSL
hsl(26, 53%, 53%)
HSB
hsb(26, 64%, 78%)
CMYK
cmyk(0%, 36%, 64%, 22%)
Oklch
oklch(66.1% 0.114 56.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

201F35
32331E

Analogous

1E2833
201F35
2A1E33

Triadic

201F35
331F1E
1E331F

Split-Comp.

201F35
332A1E
28331E

Tetradic

201F35
331E28
32331E
1E332A

Contrast Matrix WCAG 2.1 Contrast

201F35
343041
5B4143
945B44
C77F48
—
1.3
Fail
1.7
Fail
2.9
Fail
5.0
AA
1.3
Fail
—
1.4
Fail
2.3
Fail
4.0
AA Large
1.7
Fail
1.4
Fail
—
1.7
Fail
2.9
Fail
2.9
Fail
2.3
Fail
1.7
Fail
—
1.7
Fail
5.0
AA
4.0
AA Large
2.9
Fail
1.7
Fail
—
White BG
16.0AAA
12.8AAA
9.2AAA
5.5AA
3.2AA Large
Black BG
1.3Fail
1.6Fail
2.3Fail
3.8AA Large
6.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

202030
32323D
505043
7B7B4A
A8A755

Deuteranopia

20202E
33333C
515342
7F834B
ACB159

Tritanopia

202B2B
343A39
5A4242
914E4F
C36062

Achromatopsia

222222
333333
494949
696969
8E8E8E

Shades & Tints Shades & Tints

#201F35

Dark
Light

#343041

Dark
Light

#5B4143

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #201f35;
  --color-2: #343041;
  --color-3: #5b4143;
  --color-4: #945b44;
  --color-5: #c77f48;
}

SCSS

$color-1: #201f35;
$color-2: #343041;
$color-3: #5b4143;
$color-4: #945b44;
$color-5: #c77f48;

TAILWIND

colors: {
  'brand-1': '#201f35',
  'brand-2': '#343041',
  'brand-3': '#5b4143',
  'brand-4': '#945b44',
  'brand-5': '#c77f48',
}

RGB Array

[32, 31, 53], [52, 48, 65], [91, 65, 67], [148, 91, 68], [199, 127, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #201F35, #343041, #5B4143, #945B44, #C77F48 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: #201f35; --color-2: #343041; --color-3: #5b4143; --color-4: #945b44; --color-5: #c77f48. 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