← Back to Editor

#25222B · #27272F · #908B87 · #5AAA91 · #36C0B3

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 ThemeCorporate

Color Details Color Details

#25222B

Deep Indigo · DarkSlateGray · Dark Purple

HEX
#25222B
RGB
rgb(37, 34, 43)
HSL
hsl(260, 12%, 15%)
HSB
hsb(260, 21%, 17%)
CMYK
cmyk(14%, 21%, 0%, 83%)
Oklch
oklch(25.9% 0.017 300.4)

TraditionalDeep Indigo」· PaintDark Purple」· Creative Blush Sunrise

#27272F

Deep Indigo · DarkSlateGray · Dark Stone

HEX
#27272F
RGB
rgb(39, 39, 47)
HSL
hsl(240, 9%, 17%)
HSB
hsb(240, 17%, 18%)
CMYK
cmyk(17%, 17%, 0%, 82%)
Oklch
oklch(27.6% 0.015 285.4)

TraditionalDeep Indigo」· PaintDark Stone」· Creative Midnight Shadow

#908B87

Ash · Gray · Warm Gray

HEX
#908B87
RGB
rgb(144, 139, 135)
HSL
hsl(27, 4%, 55%)
HSB
hsb(27, 6%, 56%)
CMYK
cmyk(0%, 3%, 6%, 44%)
Oklch
oklch(64.0% 0.008 61.4)

TraditionalAsh」· PaintWarm Gray」· Creative Urban Concrete

#5AAA91

Mineral Blue · CadetBlue · Lake Green

HEX
#5AAA91
RGB
rgb(90, 170, 145)
HSL
hsl(161, 32%, 51%)
HSB
hsb(161, 47%, 67%)
CMYK
cmyk(47%, 0%, 15%, 33%)
Oklch
oklch(68.0% 0.088 171.1)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

#36C0B3

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#36C0B3
RGB
rgb(54, 192, 179)
HSL
hsl(174, 56%, 48%)
HSB
hsb(174, 72%, 75%)
CMYK
cmyk(72%, 0%, 7%, 25%)
Oklch
oklch(73.3% 0.116 185.7)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

25222B
282B22

Analogous

22232B
25222B
29222B

Triadic

25222B
2B2522
222B25

Split-Comp.

25222B
2B2922
232B22

Tetradic

25222B
2B2223
282B22
222B29

Contrast Matrix WCAG 2.1 Contrast

25222B
27272F
908B87
5AAA91
36C0B3
1.1
Fail
4.6
AA
5.7
AA
7.0
AA
1.1
Fail
4.4
AA Large
5.4
AA
6.6
AA
4.6
AA
4.4
AA Large
1.2
Fail
1.5
Fail
5.7
AA
5.4
AA
1.2
Fail
1.2
Fail
7.0
AA
6.6
AA
1.5
Fail
1.2
Fail
White BG
15.6AAA
14.8AAA
3.4AA Large
2.8Fail
2.2Fail
Black BG
1.3Fail
1.4Fail
6.2AA
7.6AAA
9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

242429
27272D
8E8E88
7D7D97
7273B6

Deuteranopia

242428
27272D
8E8F88
787299
6A5FB7

Tritanopia

252727
272C2B
908989
5E9C9D
3DB9B9

Achromatopsia

242424
282828
8C8C8C
8F8F8F
959595

Shades & Tints Shades & Tints

#25222B

Dark
Light

#27272F

Dark
Light

#908B87

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #25222b;
  --color-2: #27272f;
  --color-3: #908b87;
  --color-4: #5aaa91;
  --color-5: #36c0b3;
}

SCSS

$color-1: #25222b;
$color-2: #27272f;
$color-3: #908b87;
$color-4: #5aaa91;
$color-5: #36c0b3;

TAILWIND

colors: {
  'brand-1': '#25222b',
  'brand-2': '#27272f',
  'brand-3': '#908b87',
  'brand-4': '#5aaa91',
  'brand-5': '#36c0b3',
}

RGB Array

[37, 34, 43], [39, 39, 47], [144, 139, 135], [90, 170, 145], [54, 192, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #25222B, #27272F, #908B87, #5AAA91, #36C0B3 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. Low-saturation colors convey a sophisticated, premium feel. 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: #25222b; --color-2: #27272f; --color-3: #908b87; --color-4: #5aaa91; --color-5: #36c0b3. 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 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