← Back to Editor

#62808C · #4D1148 · #440230 · #800F60 · #D6AAB0

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

#62808C

Slate Blue · SlateGray · Mint Ice

HEX
#62808C
RGB
rgb(98, 128, 140)
HSL
hsl(197, 18%, 47%)
HSB
hsb(197, 30%, 55%)
CMYK
cmyk(30%, 9%, 0%, 45%)
Oklch
oklch(58.1% 0.039 224.4)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#4D1148

Rose Purple · MidnightBlue · Dark Purple

HEX
#4D1148
RGB
rgb(77, 17, 72)
HSL
hsl(305, 64%, 18%)
HSB
hsb(305, 78%, 30%)
CMYK
cmyk(0%, 78%, 6%, 70%)
Oklch
oklch(30.5% 0.113 331.6)

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

#440230

Rose Purple · Maroon · Dark Purple

HEX
#440230
RGB
rgb(68, 2, 48)
HSL
hsl(318, 94%, 14%)
HSB
hsb(318, 97%, 27%)
CMYK
cmyk(0%, 97%, 29%, 73%)
Oklch
oklch(26.0% 0.107 344.5)

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

#800F60

Rose Purple · Purple · Eggplant

HEX
#800F60
RGB
rgb(128, 15, 96)
HSL
hsl(317, 79%, 28%)
HSB
hsb(317, 88%, 50%)
CMYK
cmyk(0%, 88%, 25%, 50%)
Oklch
oklch(40.8% 0.163 343.4)

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

#D6AAB0

Peach Pink · Silver · Coral Red

HEX
#D6AAB0
RGB
rgb(214, 170, 176)
HSL
hsl(352, 35%, 75%)
HSB
hsb(352, 21%, 84%)
CMYK
cmyk(0%, 21%, 18%, 16%)
Oklch
oklch(77.9% 0.052 9.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

62808C
8D6F62

Analogous

628D84
62808C
626C8D

Triadic

62808C
8D6281
818D62

Split-Comp.

62808C
8D626C
8D8462

Tetradic

62808C
84628D
8D6F62
6C8D62

Contrast Matrix WCAG 2.1 Contrast

62808C
4D1148
440230
800F60
D6AAB0
—
3.3
AA Large
3.8
AA Large
2.3
Fail
2.1
Fail
3.3
AA Large
—
1.1
Fail
1.4
Fail
6.9
AA
3.8
AA Large
1.1
Fail
—
1.7
Fail
7.9
AAA
2.3
Fail
1.4
Fail
1.7
Fail
—
4.7
AA
2.1
Fail
6.9
AA
7.9
AAA
4.7
AA
—
White BG
4.2AA Large
14.1AAA
16.2AAA
9.7AAA
2.1Fail
Black BG
5.0AA
1.5Fail
1.3Fail
2.2Fail
10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6F6F89
33323B
272725
4F4E4C
C3C3AF

Deuteranopia

6D6B88
373B38
2B3022
565E48
C6C9AE

Tritanopia

648786
4A302E
411C1A
7A3D3A
D4ADAD

Achromatopsia

787878
292929
1B1B1B
3A3A3A
B8B8B8

Shades & Tints Shades & Tints

#62808C

Dark
Light

#4D1148

Dark
Light

#440230

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #62808c;
  --color-2: #4d1148;
  --color-3: #440230;
  --color-4: #800f60;
  --color-5: #d6aab0;
}

SCSS

$color-1: #62808c;
$color-2: #4d1148;
$color-3: #440230;
$color-4: #800f60;
$color-5: #d6aab0;

TAILWIND

colors: {
  'brand-1': '#62808c',
  'brand-2': '#4d1148',
  'brand-3': '#440230',
  'brand-4': '#800f60',
  'brand-5': '#d6aab0',
}

RGB Array

[98, 128, 140], [77, 17, 72], [68, 2, 48], [128, 15, 96], [214, 170, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #62808C, #4D1148, #440230, #800F60, #D6AAB0 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: #62808c; --color-2: #4d1148; --color-3: #440230; --color-4: #800f60; --color-5: #d6aab0. 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