← Back to Editor

#1E2832 · #1E3246 · #FFDB78 · #1E4646 · #1E3232

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

#1E2832

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#1E2832
RGB
rgb(30, 40, 50)
HSL
hsl(210, 25%, 16%)
HSB
hsb(210, 40%, 20%)
CMYK
cmyk(40%, 20%, 0%, 80%)
Oklch
oklch(27.2% 0.023 248.7)

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

#1E3246

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#1E3246
RGB
rgb(30, 50, 70)
HSL
hsl(210, 40%, 20%)
HSB
hsb(210, 57%, 27%)
CMYK
cmyk(57%, 29%, 0%, 73%)
Oklch
oklch(31.0% 0.045 249.4)

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

#FFDB78

Goose Yellow · Khaki · Sunflower

HEX
#FFDB78
RGB
rgb(255, 219, 120)
HSL
hsl(44, 100%, 74%)
HSB
hsb(44, 53%, 100%)
CMYK
cmyk(0%, 14%, 53%, 0%)
Oklch
oklch(90.2% 0.125 89.8)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#1E4646

Slate Blue · DarkSlateGray · Peacock Green

HEX
#1E4646
RGB
rgb(30, 70, 70)
HSL
hsl(180, 40%, 20%)
HSB
hsb(180, 57%, 27%)
CMYK
cmyk(57%, 0%, 0%, 73%)
Oklch
oklch(36.6% 0.045 195.4)

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

#1E3232

Slate Blue · DarkSlateGray · Peacock Green

HEX
#1E3232
RGB
rgb(30, 50, 50)
HSL
hsl(180, 25%, 16%)
HSB
hsb(180, 40%, 20%)
CMYK
cmyk(40%, 0%, 0%, 80%)
Oklch
oklch(30.0% 0.026 195.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1E2832
33291F

Analogous

1F3333
1E2832
1F1F33

Triadic

1E2832
331F29
29331F

Split-Comp.

1E2832
331F1F
33331F

Tetradic

1E2832
331F33
33291F
1F331F

Contrast Matrix WCAG 2.1 Contrast

1E2832
1E3246
FFDB78
1E4646
1E3232
—
1.1
Fail
11.1
AAA
1.4
Fail
1.1
Fail
1.1
Fail
—
9.8
AAA
1.3
Fail
1.0
Fail
11.1
AAA
9.8
AAA
—
7.8
AAA
10.1
AAA
1.4
Fail
1.3
Fail
7.8
AAA
—
1.3
Fail
1.1
Fail
1.0
Fail
10.1
AAA
1.3
Fail
—
White BG
14.9AAA
13.1AAA
1.3Fail
10.4AAA
13.5AAA
Black BG
1.4Fail
1.6Fail
15.7AAA
2.0Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

222230
272741
EFEF90
2F3046
272732

Deuteranopia

22212F
262440
F2F496
2D2A46
262432

Tritanopia

1F2E2D
1F3D3D
FDA3A7
204646
1F3232

Achromatopsia

262626
2E2E2E
DADADA
3A3A3A
2C2C2C

Shades & Tints Shades & Tints

#1E2832

Dark
Light

#1E3246

Dark
Light

#FFDB78

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1e2832;
  --color-2: #1e3246;
  --color-3: #ffdb78;
  --color-4: #1e4646;
  --color-5: #1e3232;
}

SCSS

$color-1: #1e2832;
$color-2: #1e3246;
$color-3: #ffdb78;
$color-4: #1e4646;
$color-5: #1e3232;

TAILWIND

colors: {
  'brand-1': '#1e2832',
  'brand-2': '#1e3246',
  'brand-3': '#ffdb78',
  'brand-4': '#1e4646',
  'brand-5': '#1e3232',
}

RGB Array

[30, 40, 50], [30, 50, 70], [255, 219, 120], [30, 70, 70], [30, 50, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1E2832, #1E3246, #FFDB78, #1E4646, #1E3232 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: #1e2832; --color-2: #1e3246; --color-3: #ffdb78; --color-4: #1e4646; --color-5: #1e3232. 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