← Back to Editor

#244BFF · #5A4172 · #850B83 · #382947 · #32121A

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

#244BFF

Azure · DodgerBlue · Navy Blue

HEX
#244BFF
RGB
rgb(36, 75, 255)
HSL
hsl(229, 100%, 57%)
HSB
hsb(229, 86%, 100%)
CMYK
cmyk(86%, 71%, 0%, 0%)
Oklch
oklch(52.3% 0.266 266.1)

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

#5A4172

Dark Plum · DarkSlateBlue · Eggplant

HEX
#5A4172
RGB
rgb(90, 65, 114)
HSL
hsl(271, 27%, 35%)
HSB
hsb(271, 43%, 45%)
CMYK
cmyk(21%, 43%, 0%, 55%)
Oklch
oklch(42.4% 0.084 306.6)

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

#850B83

Rose Purple · Purple · Eggplant

HEX
#850B83
RGB
rgb(133, 11, 131)
HSL
hsl(301, 85%, 28%)
HSB
hsb(301, 92%, 52%)
CMYK
cmyk(0%, 92%, 2%, 48%)
Oklch
oklch(43.5% 0.192 329.1)

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

#382947

Dark Plum · DarkSlateGray · Eggplant

HEX
#382947
RGB
rgb(56, 41, 71)
HSL
hsl(270, 27%, 22%)
HSB
hsb(270, 42%, 28%)
CMYK
cmyk(21%, 42%, 0%, 72%)
Oklch
oklch(31.2% 0.056 306.4)

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

#32121A

Crimson · Black · Deep Berry

HEX
#32121A
RGB
rgb(50, 18, 26)
HSL
hsl(345, 47%, 13%)
HSB
hsb(345, 64%, 20%)
CMYK
cmyk(0%, 64%, 48%, 80%)
Oklch
oklch(23.5% 0.053 6.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

244BFF
FFD724

Analogous

24BAFF
244BFF
6924FF

Triadic

244BFF
FF244C
4CFF24

Split-Comp.

244BFF
FF6924
BAFF24

Tetradic

244BFF
FF24BA
FFD724
24FF69

Contrast Matrix WCAG 2.1 Contrast

244BFF
5A4172
850B83
382947
32121A
—
1.4
Fail
1.5
Fail
2.2
Fail
2.8
Fail
1.4
Fail
—
1.0
Fail
1.5
Fail
2.0
Fail
1.5
Fail
1.0
Fail
—
1.5
Fail
1.9
Fail
2.2
Fail
1.5
Fail
1.5
Fail
—
1.3
Fail
2.8
Fail
2.0
Fail
1.9
Fail
1.3
Fail
—
White BG
6.0AA
8.6AAA
8.8AAA
13.3AAA
17.0AAA
Black BG
3.5AA Large
2.4Fail
2.4Fail
1.6Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

3535D3
4F4F66
504F66
323140
242418

Deuteranopia

3330C9
515363
57605F
32333E
262818

Tritanopia

26B1AA
595D5B
7F4F4A
373A39
301716

Achromatopsia

545454
4E4E4E
3D3D3D
313131
1C1C1C

Shades & Tints Shades & Tints

#244BFF

Dark
Light

#5A4172

Dark
Light

#850B83

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #244bff;
  --color-2: #5a4172;
  --color-3: #850b83;
  --color-4: #382947;
  --color-5: #32121a;
}

SCSS

$color-1: #244bff;
$color-2: #5a4172;
$color-3: #850b83;
$color-4: #382947;
$color-5: #32121a;

TAILWIND

colors: {
  'brand-1': '#244bff',
  'brand-2': '#5a4172',
  'brand-3': '#850b83',
  'brand-4': '#382947',
  'brand-5': '#32121a',
}

RGB Array

[36, 75, 255], [90, 65, 114], [133, 11, 131], [56, 41, 71], [50, 18, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #244BFF, #5A4172, #850B83, #382947, #32121A 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: #244bff; --color-2: #5a4172; --color-3: #850b83; --color-4: #382947; --color-5: #32121a. 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