#0E8BAB + #5B686B + #4C3E59 + #3B2F45 + #0000CC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#0E8BAB

Lake Blue · LightSeaGreen · Mint Ice

HEX

#0E8BAB

RGB

rgb(14, 139, 171)

HSL

hsl(192, 85%, 36%)

HSB

hsb(192, 92%, 67%)

CMYK

cmyk(92%, 19%, 0%, 33%)

Oklch

oklch(59.1% 0.107 222.2)

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

#5B686B

Slate Blue · DimGray · Charcoal

HEX

#5B686B

RGB

rgb(91, 104, 107)

HSL

hsl(191, 8%, 39%)

HSB

hsb(191, 15%, 42%)

CMYK

cmyk(15%, 3%, 0%, 58%)

Oklch

oklch(50.7% 0.017 213.2)

Traditional「Slate Blue」· Paint「Charcoal」· Creative Midnight Shadow

#4C3E59

Dark Plum · DarkSlateGray · Eggplant

HEX

#4C3E59

RGB

rgb(76, 62, 89)

HSL

hsl(271, 18%, 30%)

HSB

hsb(271, 30%, 35%)

CMYK

cmyk(15%, 30%, 0%, 65%)

Oklch

oklch(39.0% 0.048 307.9)

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

#3B2F45

Dark Plum · DarkSlateGray · Eggplant

HEX

#3B2F45

RGB

rgb(59, 47, 69)

HSL

hsl(273, 19%, 23%)

HSB

hsb(273, 32%, 27%)

CMYK

cmyk(14%, 32%, 0%, 73%)

Oklch

oklch(32.8% 0.041 309.1)

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

#0000CC

Deep Indigo · MediumBlue · Prussian Blue

HEX

#0000CC

RGB

rgb(0, 0, 204)

HSL

hsl(240, 100%, 40%)

HSB

hsb(240, 100%, 80%)

CMYK

cmyk(100%, 100%, 0%, 20%)

Oklch

oklch(38.2% 0.265 264.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0E8BAB

AA2D0E

Analogous

0EAA7B

0E8BAB

0E3DAA

Triadic

0E8BAB

AA0E8B

8BAA0E

Split-Comp.

0E8BAB

AA0E3D

AA7B0E

Tetradic

0E8BAB

7B0EAA

AA2D0E

3DAA0E

Contrast Matrix WCAG 2.1 Contrast

0E8BAB	5B686B	4C3E59	3B2F45	0000CC
—	1.5 Fail	2.5 Fail	3.2 AA Large	2.8 Fail
1.5 Fail	—	1.7 Fail	2.2 Fail	1.9 Fail
2.5 Fail	1.7 Fail	—	1.3 Fail	1.1 Fail
3.2 AA Large	2.2 Fail	1.3 Fail	—	1.1 Fail
2.8 Fail	1.9 Fail	1.1 Fail	1.1 Fail	—

White BG

4.0AA Large

5.8AA

9.8AAA

12.5AAA

11.2AAA

Black BG

5.3AA

3.6AA Large

2.1Fail

1.7Fail

1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4445A3

61616A

464652

363640

00009B

Deuteranopia

3D33A1

605F6A

474851

37373E

00008F

Tritanopia

149D9C

5C6A6A

4B4D4C

3A3B3B

00746B

Achromatopsia

696969

646464

454545

353535

171717

Shades & Tints Shades & Tints

#0E8BAB

Dark

Light

#5B686B

Dark

Light

#4C3E59

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0e8bab;
  --color-2: #5b686b;
  --color-3: #4c3e59;
  --color-4: #3b2f45;
  --color-5: #0000cc;
}

SCSS

$color-1: #0e8bab;
$color-2: #5b686b;
$color-3: #4c3e59;
$color-4: #3b2f45;
$color-5: #0000cc;

TAILWIND

colors: {
  'brand-1': '#0e8bab',
  'brand-2': '#5b686b',
  'brand-3': '#4c3e59',
  'brand-4': '#3b2f45',
  'brand-5': '#0000cc',
}

RGB Array

[14, 139, 171], [91, 104, 107], [76, 62, 89], [59, 47, 69], [0, 0, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0E8BAB, #5B686B, #4C3E59, #3B2F45, #0000CC 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: #0e8bab; --color-2: #5b686b; --color-3: #4c3e59; --color-4: #3b2f45; --color-5: #0000cc. 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