← Back to Editor

#2B2C30 · #35313B · #453745 · #613C4C · #FF1457

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

#2B2C30

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#2B2C30
RGB
rgb(43, 44, 48)
HSL
hsl(228, 5%, 18%)
HSB
hsb(228, 10%, 19%)
CMYK
cmyk(10%, 8%, 0%, 81%)
Oklch
oklch(29.4% 0.007 274.7)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#35313B

Deep Indigo · DarkSlateGray · Dark Stone

HEX
#35313B
RGB
rgb(53, 49, 59)
HSL
hsl(264, 9%, 21%)
HSB
hsb(264, 17%, 23%)
CMYK
cmyk(10%, 17%, 0%, 77%)
Oklch
oklch(32.1% 0.018 303.5)

Traditional「Deep Indigo」· Paint「Dark Stone」· Creative Midnight Shadow

#453745

Rose Purple · DarkSlateGray · Eggplant

HEX
#453745
RGB
rgb(69, 55, 69)
HSL
hsl(300, 11%, 24%)
HSB
hsb(300, 20%, 27%)
CMYK
cmyk(0%, 20%, 0%, 73%)
Oklch
oklch(35.7% 0.030 326.2)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#613C4C

Dark Violet · DarkSlateGray · Camellia

HEX
#613C4C
RGB
rgb(97, 60, 76)
HSL
hsl(334, 24%, 31%)
HSB
hsb(334, 38%, 38%)
CMYK
cmyk(0%, 38%, 22%, 62%)
Oklch
oklch(40.5% 0.057 352.4)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#FF1457

Dark Violet · Crimson · Rose Pink

HEX
#FF1457
RGB
rgb(255, 20, 87)
HSL
hsl(343, 100%, 54%)
HSB
hsb(343, 92%, 100%)
CMYK
cmyk(0%, 92%, 66%, 0%)
Oklch
oklch(64.0% 0.250 15.5)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B2C30
302F2C

Analogous

2C2F30
2B2C30
2D2C30

Triadic

2B2C30
302C2D
2D302C

Split-Comp.

2B2C30
302D2C
2F302C

Tetradic

2B2C30
302C2F
302F2C
2C302D

Contrast Matrix WCAG 2.1 Contrast

2B2C30
35313B
453745
613C4C
FF1457
—
1.1
Fail
1.3
Fail
1.5
Fail
3.6
AA Large
1.1
Fail
—
1.1
Fail
1.4
Fail
3.3
AA Large
1.3
Fail
1.1
Fail
—
1.2
Fail
2.9
Fail
1.5
Fail
1.4
Fail
1.2
Fail
—
2.4
Fail
3.6
AA Large
3.3
AA Large
2.9
Fail
2.4
Fail
—
White BG
13.9AAA
12.7AAA
11.1AAA
9.3AAA
3.8AA Large
Black BG
1.5Fail
1.7Fail
1.9Fail
2.3Fail
5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B2F
333339
3F3F42
515148
999747

Deuteranopia

2B2B2F
343438
404141
535647
A7B943

Tritanopia

2B2E2E
353736
443F3E
5F4544
F33A37

Achromatopsia

2C2C2C
333333
3D3D3D
494949
626262

Shades & Tints Shades & Tints

#2B2C30

Dark
Light

#35313B

Dark
Light

#453745

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b2c30;
  --color-2: #35313b;
  --color-3: #453745;
  --color-4: #613c4c;
  --color-5: #ff1457;
}

SCSS

$color-1: #2b2c30;
$color-2: #35313b;
$color-3: #453745;
$color-4: #613c4c;
$color-5: #ff1457;

TAILWIND

colors: {
  'brand-1': '#2b2c30',
  'brand-2': '#35313b',
  'brand-3': '#453745',
  'brand-4': '#613c4c',
  'brand-5': '#ff1457',
}

RGB Array

[43, 44, 48], [53, 49, 59], [69, 55, 69], [97, 60, 76], [255, 20, 87]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2B2C30, #35313B, #453745, #613C4C, #FF1457 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: #2b2c30; --color-2: #35313b; --color-3: #453745; --color-4: #613c4c; --color-5: #ff1457. 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