#1D426F + #27395A + #313144 + #3C282F + #462019 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#1D426F

Indigo · DarkSlateGray · Prussian Blue

HEX

#1D426F

RGB

rgb(29, 66, 111)

HSL

hsl(213, 59%, 27%)

HSB

hsb(213, 74%, 44%)

CMYK

cmyk(74%, 41%, 0%, 56%)

Oklch

oklch(37.6% 0.088 254.8)

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

#27395A

Indigo · DarkSlateGray · Prussian Blue

HEX

#27395A

RGB

rgb(39, 57, 90)

HSL

hsl(219, 40%, 25%)

HSB

hsb(219, 57%, 35%)

CMYK

cmyk(57%, 37%, 0%, 65%)

Oklch

oklch(34.6% 0.063 261.8)

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

#313144

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#313144

RGB

rgb(49, 49, 68)

HSL

hsl(240, 16%, 23%)

HSB

hsb(240, 28%, 27%)

CMYK

cmyk(28%, 28%, 0%, 73%)

Oklch

oklch(32.2% 0.034 284.4)

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

#3C282F

Dark Violet · DarkSlateGray · Raspberry

HEX

#3C282F

RGB

rgb(60, 40, 47)

HSL

hsl(339, 20%, 20%)

HSB

hsb(339, 33%, 24%)

CMYK

cmyk(0%, 33%, 22%, 76%)

Oklch

oklch(30.4% 0.032 356.4)

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

#462019

Crimson · Maroon · Deep Berry

HEX

#462019

RGB

rgb(70, 32, 25)

HSL

hsl(9, 47%, 19%)

HSB

hsb(9, 64%, 27%)

CMYK

cmyk(0%, 54%, 64%, 73%)

Oklch

oklch(29.5% 0.060 31.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1D426F

6D491C

Analogous

1C696D

1D426F

201C6D

Triadic

1D426F

6D1C41

416D1C

Split-Comp.

1D426F

6D201C

696D1C

Tetradic

1D426F

6D1C69

6D491C

1C6D20

Contrast Matrix WCAG 2.1 Contrast

1D426F	27395A	313144	3C282F	462019
—	1.1 Fail	1.2 Fail	1.3 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.2 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.1 Fail
1.3 Fail	1.2 Fail	1.1 Fail	—	1.0 Fail
1.4 Fail	1.2 Fail	1.1 Fail	1.0 Fail	—

White BG

10.2AAA

11.5AAA

12.7AAA

13.7AAA

14.2AAA

Black BG

2.1Fail

1.8Fail

1.7Fail

1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2D64

2F2F52

31313F

33332D

36351B

Deuteranopia

2B2861

2E2C50

31313E

35362D

383B1B

Tritanopia

1F5C5A

284C4A

313C3B

3B2C2C

441C1C

Achromatopsia

3C3C3C

373737

333333

2F2F2F

2B2B2B

Shades & Tints Shades & Tints

#1D426F

Dark

Light

#27395A

Dark

Light

#313144

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1d426f;
  --color-2: #27395a;
  --color-3: #313144;
  --color-4: #3c282f;
  --color-5: #462019;
}

SCSS

$color-1: #1d426f;
$color-2: #27395a;
$color-3: #313144;
$color-4: #3c282f;
$color-5: #462019;

TAILWIND

colors: {
  'brand-1': '#1d426f',
  'brand-2': '#27395a',
  'brand-3': '#313144',
  'brand-4': '#3c282f',
  'brand-5': '#462019',
}

RGB Array

[29, 66, 111], [39, 57, 90], [49, 49, 68], [60, 40, 47], [70, 32, 25]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1D426F, #27395A, #313144, #3C282F, #462019 is ideal for: tech websites, dark mode UIs, game UIs. 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: #1d426f; --color-2: #27395a; --color-3: #313144; --color-4: #3c282f; --color-5: #462019. 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 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