← Back to Editor

#1C140D · #3B2B1C · #3A425E · #3654B5 · #3845FE

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#1C140D

Tangerine · Black · Cinnamon

HEX
#1C140D
RGB
rgb(28, 20, 13)
HSL
hsl(28, 37%, 8%)
HSB
hsb(28, 54%, 11%)
CMYK
cmyk(0%, 29%, 54%, 89%)
Oklch
oklch(19.9% 0.019 62.6)

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

#3B2B1C

Tangerine · DarkSlateGray · Cinnamon

HEX
#3B2B1C
RGB
rgb(59, 43, 28)
HSL
hsl(29, 36%, 17%)
HSB
hsb(29, 53%, 23%)
CMYK
cmyk(0%, 27%, 53%, 77%)
Oklch
oklch(30.3% 0.035 64.1)

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

#3A425E

Indigo · DarkSlateGray · Prussian Blue

HEX
#3A425E
RGB
rgb(58, 66, 94)
HSL
hsl(227, 24%, 30%)
HSB
hsb(227, 38%, 37%)
CMYK
cmyk(38%, 30%, 0%, 63%)
Oklch
oklch(38.4% 0.049 271.7)

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

#3654B5

Indigo · SteelBlue · Navy Blue

HEX
#3654B5
RGB
rgb(54, 84, 181)
HSL
hsl(226, 54%, 46%)
HSB
hsb(226, 70%, 71%)
CMYK
cmyk(70%, 54%, 0%, 29%)
Oklch
oklch(47.9% 0.158 267.2)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#3845FE

Azure · SlateBlue · Cobalt Blue

HEX
#3845FE
RGB
rgb(56, 69, 254)
HSL
hsl(236, 99%, 61%)
HSB
hsb(236, 78%, 100%)
CMYK
cmyk(78%, 73%, 0%, 0%)
Oklch
oklch(52.1% 0.266 269.9)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1C140D
0D151C

Analogous

1C0D0D
1C140D
1C1B0D

Triadic

1C140D
0D1C14
140D1C

Split-Comp.

1C140D
0D1C1B
0D0D1C

Tetradic

1C140D
0D1C0D
0D151C
1B0D1C

Contrast Matrix WCAG 2.1 Contrast

1C140D
3B2B1C
3A425E
3654B5
3845FE
—
1.3
Fail
1.8
Fail
2.7
Fail
3.0
Fail
1.3
Fail
—
1.4
Fail
2.0
Fail
2.2
Fail
1.8
Fail
1.4
Fail
—
1.5
Fail
1.6
Fail
2.7
Fail
2.0
Fail
1.5
Fail
—
1.1
Fail
3.0
Fail
2.2
Fail
1.6
Fail
1.1
Fail
—
White BG
18.2AAA
13.6AAA
9.9AAA
6.8AA
6.1AA
Black BG
1.2Fail
1.5Fail
2.1Fail
3.1AA Large
3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

19180F
343420
3D3E57
43439E
3E3ED1

Deuteranopia

191A0F
353621
3D3C56
413F98
3D3CC6

Tritanopia

1C1010
3A2223
3A5251
388B87
39AEA6

Achromatopsia

161616
2E2E2E
434343
565656
565656

Shades & Tints Shades & Tints

#1C140D

Dark
Light

#3B2B1C

Dark
Light

#3A425E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1c140d;
  --color-2: #3b2b1c;
  --color-3: #3a425e;
  --color-4: #3654b5;
  --color-5: #3845fe;
}

SCSS

$color-1: #1c140d;
$color-2: #3b2b1c;
$color-3: #3a425e;
$color-4: #3654b5;
$color-5: #3845fe;

TAILWIND

colors: {
  'brand-1': '#1c140d',
  'brand-2': '#3b2b1c',
  'brand-3': '#3a425e',
  'brand-4': '#3654b5',
  'brand-5': '#3845fe',
}

RGB Array

[28, 20, 13], [59, 43, 28], [58, 66, 94], [54, 84, 181], [56, 69, 254]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1C140D, #3B2B1C, #3A425E, #3654B5, #3845FE is ideal for: tech websites, dark mode UIs, game UIs, 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: #1c140d; --color-2: #3b2b1c; --color-3: #3a425e; --color-4: #3654b5; --color-5: #3845fe. 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. 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