← Back to Editor

#110B2B · #473885 · #277B8A · #2B9E7B · #C4C4B3

dark

A 5-color dark palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#110B2B

Deep Indigo · Black · Deep Sea Blue

HEX
#110B2B
RGB
rgb(17, 11, 43)
HSL
hsl(251, 59%, 11%)
HSB
hsb(251, 74%, 17%)
CMYK
cmyk(60%, 74%, 0%, 83%)
Oklch
oklch(18.0% 0.062 287.1)

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

#473885

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX
#473885
RGB
rgb(71, 56, 133)
HSL
hsl(252, 41%, 37%)
HSB
hsb(252, 58%, 52%)
CMYK
cmyk(47%, 58%, 0%, 48%)
Oklch
oklch(40.0% 0.124 288.5)

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

#277B8A

Lake Blue · Teal · Mint Ice

HEX
#277B8A
RGB
rgb(39, 123, 138)
HSL
hsl(189, 56%, 35%)
HSB
hsb(189, 72%, 54%)
CMYK
cmyk(72%, 11%, 0%, 46%)
Oklch
oklch(54.0% 0.081 211.9)

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

#2B9E7B

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#2B9E7B
RGB
rgb(43, 158, 123)
HSL
hsl(162, 57%, 39%)
HSB
hsb(162, 73%, 62%)
CMYK
cmyk(73%, 0%, 22%, 38%)
Oklch
oklch(62.7% 0.114 168.0)

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

#C4C4B3

Fresh Green · Silver · Sunflower

HEX
#C4C4B3
RGB
rgb(196, 196, 179)
HSL
hsl(60, 13%, 74%)
HSB
hsb(60, 9%, 77%)
CMYK
cmyk(0%, 0%, 9%, 23%)
Oklch
oklch(81.6% 0.023 106.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

110B2B
272D0C

Analogous

0C162D
110B2B
220C2D

Triadic

110B2B
2D120C
0C2D12

Split-Comp.

110B2B
2D220C
162D0C

Tetradic

110B2B
2D0C16
272D0C
0C2D22

Contrast Matrix WCAG 2.1 Contrast

110B2B
473885
277B8A
2B9E7B
C4C4B3
—
2.0
Fail
3.9
AA Large
5.7
AA
10.7
AAA
2.0
Fail
—
2.0
Fail
2.9
Fail
5.5
AA
3.9
AA Large
2.0
Fail
—
1.5
Fail
2.8
Fail
5.7
AA
2.9
Fail
1.5
Fail
—
1.9
Fail
10.7
AAA
5.5
AA
2.8
Fail
1.9
Fail
—
White BG
19.0AAA
9.7AAA
4.9AA
3.3AA Large
1.8Fail
Black BG
1.1Fail
2.2Fail
4.3AA Large
6.3AA
11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0E0E23
414072
4B4C86
5D5E83
C4C4B7

Deuteranopia

0F0F21
41436E
474086
564E86
C4C4B8

Tritanopia

111D1C
466460
2B8483
318A8C
C4BABB

Achromatopsia

101010
454545
646464
787878
C2C2C2

Shades & Tints Shades & Tints

#110B2B

Dark
Light

#473885

Dark
Light

#277B8A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #110b2b;
  --color-2: #473885;
  --color-3: #277b8a;
  --color-4: #2b9e7b;
  --color-5: #c4c4b3;
}

SCSS

$color-1: #110b2b;
$color-2: #473885;
$color-3: #277b8a;
$color-4: #2b9e7b;
$color-5: #c4c4b3;

TAILWIND

colors: {
  'brand-1': '#110b2b',
  'brand-2': '#473885',
  'brand-3': '#277b8a',
  'brand-4': '#2b9e7b',
  'brand-5': '#c4c4b3',
}

RGB Array

[17, 11, 43], [71, 56, 133], [39, 123, 138], [43, 158, 123], [196, 196, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #110B2B, #473885, #277B8A, #2B9E7B, #C4C4B3 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: #110b2b; --color-2: #473885; --color-3: #277b8a; --color-4: #2b9e7b; --color-5: #c4c4b3. 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 dark-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