#1D2635 + #500022 + #88143B + #8A5658 + #938F6A - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#1D2635

Indigo · DarkSlateGray · Deep Sea Blue

HEX

#1D2635

RGB

rgb(29, 38, 53)

HSL

hsl(218, 29%, 16%)

HSB

hsb(218, 45%, 21%)

CMYK

cmyk(45%, 28%, 0%, 79%)

Oklch

oklch(26.7% 0.031 260.4)

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

#500022

Dark Violet · Maroon · Raspberry

HEX

#500022

RGB

rgb(80, 0, 34)

HSL

hsl(335, 100%, 16%)

HSB

hsb(335, 100%, 31%)

CMYK

cmyk(0%, 100%, 58%, 69%)

Oklch

oklch(27.8% 0.112 3.9)

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

#88143B

Dark Violet · Brown · Camellia

HEX

#88143B

RGB

rgb(136, 20, 59)

HSL

hsl(340, 74%, 31%)

HSB

hsb(340, 85%, 53%)

CMYK

cmyk(0%, 85%, 57%, 47%)

Oklch

oklch(41.2% 0.150 8.1)

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

#8A5658

Crimson · DimGray · Passion Red

HEX

#8A5658

RGB

rgb(138, 86, 88)

HSL

hsl(358, 23%, 44%)

HSB

hsb(358, 38%, 54%)

CMYK

cmyk(0%, 38%, 36%, 46%)

Oklch

oklch(51.2% 0.069 17.3)

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

#938F6A

Autumn Sage · Gray · Honey Gold

HEX

#938F6A

RGB

rgb(147, 143, 106)

HSL

hsl(54, 16%, 50%)

HSB

hsb(54, 28%, 58%)

CMYK

cmyk(0%, 3%, 28%, 42%)

Oklch

oklch(64.4% 0.052 102.6)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1D2635

352C1D

Analogous

1D3135

1D2635

201D35

Triadic

1D2635

351D26

26351D

Split-Comp.

1D2635

35201D

31351D

Tetradic

1D2635

351D31

352C1D

1D3520

Contrast Matrix WCAG 2.1 Contrast

1D2635	500022	88143B	8A5658	938F6A
—	1.0 Fail	1.6 Fail	2.6 Fail	4.6 AA
1.0 Fail	—	1.6 Fail	2.6 Fail	4.7 AA
1.6 Fail	1.6 Fail	—	1.6 Fail	2.9 Fail
2.6 Fail	2.6 Fail	1.6 Fail	—	1.8 Fail
4.6 AA	4.7 AA	2.9 Fail	1.8 Fail	—

White BG

15.2AAA

15.4AAA

9.5AAA

5.9AA

3.3AA Large

Black BG

1.4Fail

2.2Fail

3.6AA Large

6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

212131

2D2D1A

565532

737358

919173

Deuteranopia

202030

323818

5D652F

777A57

929275

Tritanopia

1D2F2E

4C1312

822A28

875757

937A7C

Achromatopsia

252525

1C1C1C

3B3B3B

666666

8C8C8C

Shades & Tints Shades & Tints

#1D2635

Dark

Light

#500022

Dark

Light

#88143B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1d2635;
  --color-2: #500022;
  --color-3: #88143b;
  --color-4: #8a5658;
  --color-5: #938f6a;
}

SCSS

$color-1: #1d2635;
$color-2: #500022;
$color-3: #88143b;
$color-4: #8a5658;
$color-5: #938f6a;

TAILWIND

colors: {
  'brand-1': '#1d2635',
  'brand-2': '#500022',
  'brand-3': '#88143b',
  'brand-4': '#8a5658',
  'brand-5': '#938f6a',
}

RGB Array

[29, 38, 53], [80, 0, 34], [136, 20, 59], [138, 86, 88], [147, 143, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1D2635, #500022, #88143B, #8A5658, #938F6A 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: #1d2635; --color-2: #500022; --color-3: #88143b; --color-4: #8a5658; --color-5: #938f6a. 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