← Back to Editor

#1E3B45 · #304848 · #484948 · #604748 · #85775D

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

#1E3B45

Slate Blue · DarkSlateGray · Peacock Green

HEX
#1E3B45
RGB
rgb(30, 59, 69)
HSL
hsl(195, 39%, 19%)
HSB
hsb(195, 57%, 27%)
CMYK
cmyk(57%, 14%, 0%, 73%)
Oklch
oklch(33.4% 0.039 222.5)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#304848

Slate Blue · DarkSlateGray · Peacock Green

HEX
#304848
RGB
rgb(48, 72, 72)
HSL
hsl(180, 20%, 24%)
HSB
hsb(180, 33%, 28%)
CMYK
cmyk(33%, 0%, 0%, 72%)
Oklch
oklch(38.2% 0.030 196.0)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#484948

Dark Cyan · DarkSlateGray · Charcoal

HEX
#484948
RGB
rgb(72, 73, 72)
HSL
hsl(120, 1%, 28%)
HSB
hsb(120, 1%, 29%)
CMYK
cmyk(1%, 0%, 1%, 71%)
Oklch
oklch(40.4% 0.002 145.5)

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

#604748

Crimson · DarkOliveGreen · Wine Red

HEX
#604748
RGB
rgb(96, 71, 72)
HSL
hsl(358, 15%, 33%)
HSB
hsb(358, 26%, 38%)
CMYK
cmyk(0%, 26%, 25%, 62%)
Oklch
oklch(42.5% 0.034 15.9)

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

#85775D

Ochre · DimGray · Amber Brown

HEX
#85775D
RGB
rgb(133, 119, 93)
HSL
hsl(39, 18%, 44%)
HSB
hsb(39, 30%, 52%)
CMYK
cmyk(0%, 11%, 30%, 48%)
Oklch
oklch(57.5% 0.042 82.8)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1E3B45
43271E

Analogous

1E433A
1E3B45
1E2743

Triadic

1E3B45
431E3A
3A431E

Split-Comp.

1E3B45
431E27
433A1E

Tetradic

1E3B45
3A1E43
43271E
27431E

Contrast Matrix WCAG 2.1 Contrast

1E3B45
304848
484948
604748
85775D
—
1.2
Fail
1.3
Fail
1.4
Fail
2.7
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
2.2
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
2.1
Fail
1.4
Fail
1.2
Fail
1.1
Fail
—
1.9
Fail
2.7
Fail
2.2
Fail
2.1
Fail
1.9
Fail
—
White BG
11.9AAA
9.8AAA
9.0AAA
8.4AAA
4.4AA Large
Black BG
1.8Fail
2.1Fail
2.3Fail
2.5Fail
4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B43
3A3B48
484848
555548
7F7F63

Deuteranopia

292742
393748
484848
575848
808165

Tritanopia

1F4140
314848
484848
5F4848
846869

Achromatopsia

333333
414141
494949
4F4F4F
787878

Shades & Tints Shades & Tints

#1E3B45

Dark
Light

#304848

Dark
Light

#484948

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1e3b45;
  --color-2: #304848;
  --color-3: #484948;
  --color-4: #604748;
  --color-5: #85775d;
}

SCSS

$color-1: #1e3b45;
$color-2: #304848;
$color-3: #484948;
$color-4: #604748;
$color-5: #85775d;

TAILWIND

colors: {
  'brand-1': '#1e3b45',
  'brand-2': '#304848',
  'brand-3': '#484948',
  'brand-4': '#604748',
  'brand-5': '#85775d',
}

RGB Array

[30, 59, 69], [48, 72, 72], [72, 73, 72], [96, 71, 72], [133, 119, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1E3B45, #304848, #484948, #604748, #85775D 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: #1e3b45; --color-2: #304848; --color-3: #484948; --color-4: #604748; --color-5: #85775d. 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