← Back to Editor

#16273B · #2C2C36 · #454636 · #D89E5E · #993F3E

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 LibraryData Visualization

Color Details Color Details

#16273B

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#16273B
RGB
rgb(22, 39, 59)
HSL
hsl(212, 46%, 16%)
HSB
hsb(212, 63%, 23%)
CMYK
cmyk(63%, 34%, 0%, 77%)
Oklch
oklch(26.8% 0.044 253.3)

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

#2C2C36

Deep Indigo · DarkSlateGray · Deep Sea Blue

HEX
#2C2C36
RGB
rgb(44, 44, 54)
HSL
hsl(240, 10%, 19%)
HSB
hsb(240, 19%, 21%)
CMYK
cmyk(19%, 19%, 0%, 79%)
Oklch
oklch(29.7% 0.018 285.3)

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

#454636

Autumn Sage · DarkSlateGray · Amber Gold

HEX
#454636
RGB
rgb(69, 70, 54)
HSL
hsl(64, 13%, 24%)
HSB
hsb(64, 23%, 27%)
CMYK
cmyk(1%, 0%, 23%, 73%)
Oklch
oklch(38.8% 0.026 110.5)

Traditional「Autumn Sage」· Paint「Amber Gold」· Creative Blush Sunrise

#D89E5E

Ginger · SandyBrown · Warm Sun

HEX
#D89E5E
RGB
rgb(216, 158, 94)
HSL
hsl(31, 61%, 61%)
HSB
hsb(31, 56%, 85%)
CMYK
cmyk(0%, 27%, 56%, 15%)
Oklch
oklch(74.1% 0.107 67.6)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#993F3E

Crimson · Sienna · Passion Red

HEX
#993F3E
RGB
rgb(153, 63, 62)
HSL
hsl(1, 42%, 42%)
HSB
hsb(1, 59%, 60%)
CMYK
cmyk(0%, 59%, 59%, 40%)
Oklch
oklch(48.9% 0.121 23.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

16273B
3C2A16

Analogous

163A3C
16273B
17163C

Triadic

16273B
3C1628
283C16

Split-Comp.

16273B
3C1716
3A3C16

Tetradic

16273B
3C163A
3C2A16
163C17

Contrast Matrix WCAG 2.1 Contrast

16273B
2C2C36
454636
D89E5E
993F3E
—
1.1
Fail
1.6
Fail
6.5
AA
2.3
Fail
1.1
Fail
—
1.4
Fail
5.9
AA
2.1
Fail
1.6
Fail
1.4
Fail
—
4.1
AA Large
1.4
Fail
6.5
AA
5.9
AA
4.1
AA Large
—
2.9
Fail
2.3
Fail
2.1
Fail
1.4
Fail
2.9
Fail
—
White BG
15.1AAA
13.8AAA
9.6AAA
2.3Fail
6.7AA
Black BG
1.4Fail
1.5Fail
2.2Fail
9.0AAA
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

1D1E36
2C2C34
45453A
BFBE6D
72713E

Deuteranopia

1C1B35
2C2C33
45453B
C2C771
777E3E

Tritanopia

173232
2C3231
453D3E
D57A7C
953E3E

Achromatopsia

242424
2D2D2D
444444
A8A8A8
5A5A5A

Shades & Tints Shades & Tints

#16273B

Dark
Light

#2C2C36

Dark
Light

#454636

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #16273b;
  --color-2: #2c2c36;
  --color-3: #454636;
  --color-4: #d89e5e;
  --color-5: #993f3e;
}

SCSS

$color-1: #16273b;
$color-2: #2c2c36;
$color-3: #454636;
$color-4: #d89e5e;
$color-5: #993f3e;

TAILWIND

colors: {
  'brand-1': '#16273b',
  'brand-2': '#2c2c36',
  'brand-3': '#454636',
  'brand-4': '#d89e5e',
  'brand-5': '#993f3e',
}

RGB Array

[22, 39, 59], [44, 44, 54], [69, 70, 54], [216, 158, 94], [153, 63, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #16273B, #2C2C36, #454636, #D89E5E, #993F3E 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: #16273b; --color-2: #2c2c36; --color-3: #454636; --color-4: #d89e5e; --color-5: #993f3e. 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 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