← Back to Editor

#26172B · #503A66 · #7D94AD · #ADEDD5 · #1C1C1C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#26172B

Dark Plum · Black · Dark Purple

HEX
#26172B
RGB
rgb(38, 23, 43)
HSL
hsl(285, 30%, 13%)
HSB
hsb(285, 47%, 17%)
CMYK
cmyk(12%, 47%, 0%, 83%)
Oklch
oklch(23.4% 0.043 317.4)

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

#503A66

Dark Plum · DarkSlateBlue · Eggplant

HEX
#503A66
RGB
rgb(80, 58, 102)
HSL
hsl(270, 28%, 31%)
HSB
hsb(270, 43%, 40%)
CMYK
cmyk(22%, 43%, 0%, 60%)
Oklch
oklch(39.2% 0.077 306.2)

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

#7D94AD

Azure · LightSlateGray · Navy Blue

HEX
#7D94AD
RGB
rgb(125, 148, 173)
HSL
hsl(211, 23%, 58%)
HSB
hsb(211, 28%, 68%)
CMYK
cmyk(28%, 14%, 0%, 32%)
Oklch
oklch(65.7% 0.046 250.7)

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

#ADEDD5

Jade · LightBlue · Apple Green

HEX
#ADEDD5
RGB
rgb(173, 237, 213)
HSL
hsl(158, 64%, 80%)
HSB
hsb(158, 27%, 93%)
CMYK
cmyk(27%, 0%, 10%, 7%)
Oklch
oklch(89.6% 0.073 169.5)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#1C1C1C

Ink Black · Black · Dark Stone

HEX
#1C1C1C
RGB
rgb(28, 28, 28)
HSL
hsl(0, 0%, 11%)
HSB
hsb(0, 0%, 11%)
CMYK
cmyk(0%, 0%, 0%, 89%)
Oklch
oklch(22.6% 0.000 89.9)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

26172B
1C2B17

Analogous

1C172B
26172B
2B1726

Triadic

26172B
2B2617
172B26

Split-Comp.

26172B
262B17
172B1C

Tetradic

26172B
2B1C17
1C2B17
17262B

Contrast Matrix WCAG 2.1 Contrast

26172B
503A66
7D94AD
ADEDD5
1C1C1C
—
1.7
Fail
5.4
AA
12.8
AAA
1.0
Fail
1.7
Fail
—
3.1
AA Large
7.4
AAA
1.7
Fail
5.4
AA
3.1
AA Large
—
2.4
Fail
5.4
AA
12.8
AAA
7.4
AAA
2.4
Fail
—
12.9
AAA
1.0
Fail
1.7
Fail
5.4
AA
12.9
AAA
—
White BG
16.9AAA
9.8AAA
3.1AA Large
1.3Fail
17.0AAA
Black BG
1.2Fail
2.1Fail
6.7AA
15.9AAA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

201F26
46465B
8787A7
C9C9DB
1C1C1C

Deuteranopia

202225
484959
8684A6
C5C0DC
1C1C1C

Tritanopia

252222
4F5351
7EA2A1
B0DFE0
1C1C1C

Achromatopsia

1E1E1E
464646
909090
D7D7D7
1C1C1C

Shades & Tints Shades & Tints

#26172B

Dark
Light

#503A66

Dark
Light

#7D94AD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #26172b;
  --color-2: #503a66;
  --color-3: #7d94ad;
  --color-4: #adedd5;
  --color-5: #1c1c1c;
}

SCSS

$color-1: #26172b;
$color-2: #503a66;
$color-3: #7d94ad;
$color-4: #adedd5;
$color-5: #1c1c1c;

TAILWIND

colors: {
  'brand-1': '#26172b',
  'brand-2': '#503a66',
  'brand-3': '#7d94ad',
  'brand-4': '#adedd5',
  'brand-5': '#1c1c1c',
}

RGB Array

[38, 23, 43], [80, 58, 102], [125, 148, 173], [173, 237, 213], [28, 28, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #26172B, #503A66, #7D94AD, #ADEDD5, #1C1C1C is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #26172b; --color-2: #503a66; --color-3: #7d94ad; --color-4: #adedd5; --color-5: #1c1c1c. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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