← Back to Editor

#48474F · #D1D589 · #39685E · #19414D · #091839

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#48474F

Dark Cyan · DarkSlateGray · Charcoal

HEX
#48474F
RGB
rgb(72, 71, 79)
HSL
hsl(248, 5%, 29%)
HSB
hsb(248, 10%, 31%)
CMYK
cmyk(9%, 10%, 0%, 69%)
Oklch
oklch(40.2% 0.013 291.5)

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

#D1D589

Fresh Green · BurlyWood · Sunflower

HEX
#D1D589
RGB
rgb(209, 213, 137)
HSL
hsl(63, 48%, 69%)
HSB
hsb(63, 36%, 84%)
CMYK
cmyk(2%, 0%, 36%, 16%)
Oklch
oklch(85.3% 0.098 110.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#39685E

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#39685E
RGB
rgb(57, 104, 94)
HSL
hsl(167, 29%, 32%)
HSB
hsb(167, 45%, 41%)
CMYK
cmyk(45%, 0%, 10%, 59%)
Oklch
oklch(48.1% 0.054 178.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#19414D

Lake Blue · DarkSlateGray · Peacock Green

HEX
#19414D
RGB
rgb(25, 65, 77)
HSL
hsl(194, 51%, 20%)
HSB
hsb(194, 68%, 30%)
CMYK
cmyk(68%, 16%, 0%, 70%)
Oklch
oklch(35.2% 0.049 220.5)

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

#091839

Indigo · MidnightBlue · Deep Sea Blue

HEX
#091839
RGB
rgb(9, 24, 57)
HSL
hsl(221, 73%, 13%)
HSB
hsb(221, 84%, 22%)
CMYK
cmyk(84%, 58%, 0%, 78%)
Oklch
oklch(21.9% 0.067 263.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

48474F
4D4E46

Analogous

46494E
48474F
4B464E

Triadic

48474F
4E4746
464E47

Split-Comp.

48474F
4E4B46
494E46

Tetradic

48474F
4E4649
4D4E46
464E4B

Contrast Matrix WCAG 2.1 Contrast

48474F
D1D589
39685E
19414D
091839
—
5.9
AA
1.4
Fail
1.2
Fail
1.9
Fail
5.9
AA
—
4.1
AA Large
7.1
AAA
11.3
AAA
1.4
Fail
4.1
AA Large
—
1.7
Fail
2.8
Fail
1.2
Fail
7.1
AAA
1.7
Fail
—
1.6
Fail
1.9
Fail
11.3
AAA
2.8
Fail
1.6
Fail
—
White BG
9.2AAA
1.5Fail
6.3AA
11.0AAA
17.5AAA
Black BG
2.3Fail
13.6AAA
3.3AA Large
1.9Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

48484D
D3D39B
4D4E60
2A2B4A
0F1031

Deuteranopia

48484D
D3D2A0
4B4761
282549
0F0E2F

Tritanopia

484C4B
D1AAAD
3B6263
1B4847
0A2B29

Achromatopsia

484848
CBCBCB
595959
363636
171717

Shades & Tints Shades & Tints

#48474F

Dark
Light

#D1D589

Dark
Light

#39685E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #48474f;
  --color-2: #d1d589;
  --color-3: #39685e;
  --color-4: #19414d;
  --color-5: #091839;
}

SCSS

$color-1: #48474f;
$color-2: #d1d589;
$color-3: #39685e;
$color-4: #19414d;
$color-5: #091839;

TAILWIND

colors: {
  'brand-1': '#48474f',
  'brand-2': '#d1d589',
  'brand-3': '#39685e',
  'brand-4': '#19414d',
  'brand-5': '#091839',
}

RGB Array

[72, 71, 79], [209, 213, 137], [57, 104, 94], [25, 65, 77], [9, 24, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #48474F, #D1D589, #39685E, #19414D, #091839 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: #48474f; --color-2: #d1d589; --color-3: #39685e; --color-4: #19414d; --color-5: #091839. 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