← Back to Editor

#253635 · #213635 · #1D3536 · #1A1A1A · #520404

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#253635

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#253635
RGB
rgb(37, 54, 53)
HSL
hsl(176, 19%, 18%)
HSB
hsb(176, 31%, 21%)
CMYK
cmyk(31%, 0%, 2%, 79%)
Oklch
oklch(31.8% 0.022 191.5)

TraditionalMineral Blue」· PaintPeacock Green」· Creative Blush Sunrise

#213635

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#213635
RGB
rgb(33, 54, 53)
HSL
hsl(177, 24%, 17%)
HSB
hsb(177, 39%, 21%)
CMYK
cmyk(39%, 0%, 2%, 79%)
Oklch
oklch(31.5% 0.027 192.1)

TraditionalMineral Blue」· PaintPeacock Green」· Creative Blush Sunrise

#1D3536

Slate Blue · DarkSlateGray · Peacock Green

HEX
#1D3536
RGB
rgb(29, 53, 54)
HSL
hsl(182, 30%, 16%)
HSB
hsb(182, 46%, 21%)
CMYK
cmyk(46%, 2%, 0%, 79%)
Oklch
oklch(31.0% 0.030 199.1)

TraditionalSlate Blue」· PaintPeacock Green」· Creative Blush Sunrise

#1A1A1A

Ink Black · Black · Jet Black

HEX
#1A1A1A
RGB
rgb(26, 26, 26)
HSL
hsl(0, 0%, 10%)
HSB
hsb(0, 0%, 10%)
CMYK
cmyk(0%, 0%, 0%, 90%)
Oklch
oklch(21.8% 0.000 89.9)

TraditionalInk Black」· PaintJet Black」· Creative Midnight Shadow

#520404

Vermilion · Maroon · Deep Berry

HEX
#520404
RGB
rgb(82, 4, 4)
HSL
hsl(0, 91%, 17%)
HSB
hsb(0, 95%, 32%)
CMYK
cmyk(0%, 95%, 95%, 68%)
Oklch
oklch(27.9% 0.109 28.1)

TraditionalVermilion」· PaintDeep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

253635
372526

Analogous

25372D
253635
252F37

Triadic

253635
352537
373525

Split-Comp.

253635
37252F
372D25

Tetradic

253635
2D2537
372526
2F3725

Contrast Matrix WCAG 2.1 Contrast

253635
213635
1D3536
1A1A1A
520404
1.0
Fail
1.0
Fail
1.4
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.4
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.3
Fail
1.2
Fail
1.4
Fail
1.4
Fail
1.3
Fail
1.1
Fail
1.2
Fail
1.2
Fail
1.2
Fail
1.1
Fail
White BG
12.7AAA
12.8AAA
13.0AAA
17.4AAA
15.2AAA
Black BG
1.7Fail
1.6Fail
1.6Fail
1.2Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2D35
2A2A35
272836
1A1A1A
303004

Deuteranopia

2B2A35
292735
262436
1A1A1A
353B04

Tritanopia

263535
223535
1E3636
1A1A1A
4E0404

Achromatopsia

313131
303030
2E2E2E
1A1A1A
1B1B1B

Shades & Tints Shades & Tints

#253635

Dark
Light

#213635

Dark
Light

#1D3536

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #253635;
  --color-2: #213635;
  --color-3: #1d3536;
  --color-4: #1a1a1a;
  --color-5: #520404;
}

SCSS

$color-1: #253635;
$color-2: #213635;
$color-3: #1d3536;
$color-4: #1a1a1a;
$color-5: #520404;

TAILWIND

colors: {
  'brand-1': '#253635',
  'brand-2': '#213635',
  'brand-3': '#1d3536',
  'brand-4': '#1a1a1a',
  'brand-5': '#520404',
}

RGB Array

[37, 54, 53], [33, 54, 53], [29, 53, 54], [26, 26, 26], [82, 4, 4]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #253635, #213635, #1D3536, #1A1A1A, #520404 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: #253635; --color-2: #213635; --color-3: #1d3536; --color-4: #1a1a1a; --color-5: #520404. 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