#10102A + #023852 + #444281 + #714C82 + #986584 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#10102A

Deep Indigo · Black · Deep Sea Blue

HEX

#10102A

RGB

rgb(16, 16, 42)

HSL

hsl(240, 45%, 11%)

HSB

hsb(240, 62%, 16%)

CMYK

cmyk(62%, 62%, 0%, 84%)

Oklch

oklch(19.0% 0.051 280.3)

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

#023852

Lake Blue · MidnightBlue · Deep Sea Blue

HEX

#023852

RGB

rgb(2, 56, 82)

HSL

hsl(200, 95%, 16%)

HSB

hsb(200, 98%, 32%)

CMYK

cmyk(98%, 32%, 0%, 68%)

Oklch

oklch(32.3% 0.069 236.9)

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

#444281

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#444281

RGB

rgb(68, 66, 129)

HSL

hsl(242, 32%, 38%)

HSB

hsb(242, 49%, 51%)

CMYK

cmyk(47%, 49%, 0%, 49%)

Oklch

oklch(41.4% 0.103 282.4)

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

#714C82

Dark Plum · DimGray · Eggplant

HEX

#714C82

RGB

rgb(113, 76, 130)

HSL

hsl(281, 26%, 40%)

HSB

hsb(281, 42%, 51%)

CMYK

cmyk(13%, 42%, 0%, 49%)

Oklch

oklch(47.9% 0.094 314.6)

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

#986584

Rose Purple · Gray · Camellia

HEX

#986584

RGB

rgb(152, 101, 132)

HSL

hsl(324, 20%, 50%)

HSB

hsb(324, 34%, 60%)

CMYK

cmyk(0%, 34%, 13%, 40%)

Oklch

oklch(57.1% 0.078 342.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

10102A

29290F

Analogous

0F1C29

10102A

1C0F29

Triadic

10102A

290F0F

0F290F

Split-Comp.

10102A

291C0F

1C290F

Tetradic

10102A

290F1C

29290F

0F291C

Contrast Matrix WCAG 2.1 Contrast

10102A	023852	444281	714C82	986584
—	1.5 Fail	2.1 Fail	2.7 Fail	4.0 AA Large
1.5 Fail	—	1.4 Fail	1.8 Fail	2.7 Fail
2.1 Fail	1.4 Fail	—	1.3 Fail	1.9 Fail
2.7 Fail	1.8 Fail	1.3 Fail	—	1.5 Fail
4.0 AA Large	2.7 Fail	1.9 Fail	1.5 Fail	—

White BG

18.6AAA

12.4AAA

9.0AAA

6.9AA

4.6AA

Black BG

1.1Fail

1.7Fail

2.3Fail

3.1AA Large

4.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

101024

191A4C

434372

616175

82817C

Deuteranopia

101022

16124A

43436E

636672

85897B

Tritanopia

101F1E

054746

446663

6F6B68

957775

Achromatopsia

131313

2B2B2B

4A4A4A

5D5D5D

787878

Shades & Tints Shades & Tints

#10102A

Dark

Light

#023852

Dark

Light

#444281

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #10102a;
  --color-2: #023852;
  --color-3: #444281;
  --color-4: #714c82;
  --color-5: #986584;
}

SCSS

$color-1: #10102a;
$color-2: #023852;
$color-3: #444281;
$color-4: #714c82;
$color-5: #986584;

TAILWIND

colors: {
  'brand-1': '#10102a',
  'brand-2': '#023852',
  'brand-3': '#444281',
  'brand-4': '#714c82',
  'brand-5': '#986584',
}

RGB Array

[16, 16, 42], [2, 56, 82], [68, 66, 129], [113, 76, 130], [152, 101, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #10102A, #023852, #444281, #714C82, #986584 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: #10102a; --color-2: #023852; --color-3: #444281; --color-4: #714c82; --color-5: #986584. 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