#7C4E71 + #53345A + #182C42 + #1A4B4B + #1D6153 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7C4E71

Rose Purple · DimGray · Eggplant

HEX

#7C4E71

RGB

rgb(124, 78, 113)

HSL

hsl(314, 23%, 40%)

HSB

hsb(314, 37%, 49%)

CMYK

cmyk(0%, 37%, 9%, 51%)

Oklch

oklch(48.8% 0.079 335.9)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#53345A

Dark Plum · DarkSlateGray · Eggplant

HEX

#53345A

RGB

rgb(83, 52, 90)

HSL

hsl(289, 27%, 28%)

HSB

hsb(289, 42%, 35%)

CMYK

cmyk(8%, 42%, 0%, 65%)

Oklch

oklch(37.8% 0.074 320.1)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#182C42

Indigo · DarkSlateGray · Deep Sea Blue

HEX

#182C42

RGB

rgb(24, 44, 66)

HSL

hsl(211, 47%, 18%)

HSB

hsb(211, 64%, 26%)

CMYK

cmyk(64%, 33%, 0%, 74%)

Oklch

oklch(28.8% 0.048 251.9)

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

#1A4B4B

Slate Blue · DarkSlateGray · Peacock Green

HEX

#1A4B4B

RGB

rgb(26, 75, 75)

HSL

hsl(180, 49%, 20%)

HSB

hsb(180, 65%, 29%)

CMYK

cmyk(65%, 0%, 0%, 71%)

Oklch

oklch(38.0% 0.052 195.2)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#1D6153

Mineral Blue · DarkSlateGray · Peacock Green

HEX

#1D6153

RGB

rgb(29, 97, 83)

HSL

hsl(168, 54%, 25%)

HSB

hsb(168, 70%, 38%)

CMYK

cmyk(70%, 0%, 14%, 62%)

Oklch

oklch(44.6% 0.071 176.4)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C4E71

4F7D59

Analogous

714F7D

7C4E71

7D4F5B

Triadic

7C4E71

737D4F

4F737D

Split-Comp.

7C4E71

5B7D4F

4F7D71

Tetradic

7C4E71

7D714F

4F7D59

4F5B7D

Contrast Matrix WCAG 2.1 Contrast

7C4E71	53345A	182C42	1A4B4B	1D6153
—	1.6 Fail	2.2 Fail	1.5 Fail	1.1 Fail
1.6 Fail	—	1.4 Fail	1.1 Fail	1.4 Fail
2.2 Fail	1.4 Fail	—	1.5 Fail	2.0 Fail
1.5 Fail	1.1 Fail	1.5 Fail	—	1.3 Fail
1.1 Fail	1.4 Fail	2.0 Fail	1.3 Fail	—

White BG

6.6AA

10.5AAA

14.2AAA

9.8AAA

7.3AAA

Black BG

3.2AA Large

2.0Fail

1.5Fail

2.2Fail

2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

686869

464551

21213D

2F304B

3A3B56

Deuteranopia

6B6E67

474A4F

201E3B

2C294B

373157

Tritanopia

7A6260

514A48

193838

1C4B4B

20595A

Achromatopsia

606060

424242

292929

3C3C3C

4B4B4B

Shades & Tints Shades & Tints

#7C4E71

Dark

Light

#53345A

Dark

Light

#182C42

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c4e71;
  --color-2: #53345a;
  --color-3: #182c42;
  --color-4: #1a4b4b;
  --color-5: #1d6153;
}

SCSS

$color-1: #7c4e71;
$color-2: #53345a;
$color-3: #182c42;
$color-4: #1a4b4b;
$color-5: #1d6153;

TAILWIND

colors: {
  'brand-1': '#7c4e71',
  'brand-2': '#53345a',
  'brand-3': '#182c42',
  'brand-4': '#1a4b4b',
  'brand-5': '#1d6153',
}

RGB Array

[124, 78, 113], [83, 52, 90], [24, 44, 66], [26, 75, 75], [29, 97, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #7C4E71, #53345A, #182C42, #1A4B4B, #1D6153 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: #7c4e71; --color-2: #53345a; --color-3: #182c42; --color-4: #1a4b4b; --color-5: #1d6153. 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 space-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