← Back to Editor

#0D0701 · #1E1D19 · #303033 · #F9F8FB · #8C5D82

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

Color Details Color Details

#0D0701

Ochre · Black · Cinnamon

HEX
#0D0701
RGB
rgb(13, 7, 1)
HSL
hsl(30, 86%, 3%)
HSB
hsb(30, 92%, 5%)
CMYK
cmyk(0%, 46%, 92%, 95%)
Oklch
oklch(13.5% 0.023 79.2)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#1E1D19

Ochre · Black · Dark Stone

HEX
#1E1D19
RGB
rgb(30, 29, 25)
HSL
hsl(48, 9%, 11%)
HSB
hsb(48, 17%, 12%)
CMYK
cmyk(0%, 3%, 17%, 88%)
Oklch
oklch(23.0% 0.008 95.4)

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

#303033

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#303033
RGB
rgb(48, 48, 51)
HSL
hsl(240, 3%, 19%)
HSB
hsb(240, 6%, 20%)
CMYK
cmyk(6%, 6%, 0%, 80%)
Oklch
oklch(31.0% 0.005 286.1)

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

#F9F8FB

Wisteria · Snow · Lavender

HEX
#F9F8FB
RGB
rgb(249, 248, 251)
HSL
hsl(260, 27%, 98%)
HSB
hsb(260, 1%, 98%)
CMYK
cmyk(1%, 1%, 0%, 2%)
Oklch
oklch(98.1% 0.004 301.4)

Traditional「Wisteria」· Paint「Lavender」· Creative Lavender Dream

#8C5D82

Rose Purple · Gray · Violet

HEX
#8C5D82
RGB
rgb(140, 93, 130)
HSL
hsl(313, 20%, 46%)
HSB
hsb(313, 34%, 55%)
CMYK
cmyk(0%, 34%, 7%, 45%)
Oklch
oklch(54.2% 0.080 334.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0D0701
01080E

Analogous

0E0101
0D0701
0E0E01

Triadic

0D0701
010E08
08010E

Split-Comp.

0D0701
010E0E
01010E

Tetradic

0D0701
010E01
01080E
0E010E

Contrast Matrix WCAG 2.1 Contrast

0D0701
1E1D19
303033
F9F8FB
8C5D82
—
1.2
Fail
1.5
Fail
18.9
AAA
3.8
AA Large
1.2
Fail
—
1.3
Fail
15.9
AAA
3.2
AA Large
1.5
Fail
1.3
Fail
—
12.4
AAA
2.5
Fail
18.9
AAA
15.9
AAA
12.4
AAA
—
5.0
AA
3.8
AA Large
3.2
AA Large
2.5
Fail
5.0
AA
—
White BG
20.0AAA
16.9AAA
13.2AAA
1.1Fail
5.2AA
Black BG
1.0Fail
1.2Fail
1.6Fail
19.8AAA
4.0AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

0A0A02
1E1E1A
303032
F9F9FA
787779

Deuteranopia

0B0B03
1E1E1A
303032
F9F9FA
7A7E77

Tritanopia

0D0404
1E1B1B
303232
F9FAFA
8A7270

Achromatopsia

080808
1D1D1D
303030
F9F9F9
6F6F6F

Shades & Tints Shades & Tints

#0D0701

Dark
Light

#1E1D19

Dark
Light

#303033

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0d0701;
  --color-2: #1e1d19;
  --color-3: #303033;
  --color-4: #f9f8fb;
  --color-5: #8c5d82;
}

SCSS

$color-1: #0d0701;
$color-2: #1e1d19;
$color-3: #303033;
$color-4: #f9f8fb;
$color-5: #8c5d82;

TAILWIND

colors: {
  'brand-1': '#0d0701',
  'brand-2': '#1e1d19',
  'brand-3': '#303033',
  'brand-4': '#f9f8fb',
  'brand-5': '#8c5d82',
}

RGB Array

[13, 7, 1], [30, 29, 25], [48, 48, 51], [249, 248, 251], [140, 93, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0D0701, #1E1D19, #303033, #F9F8FB, #8C5D82 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #0d0701; --color-2: #1e1d19; --color-3: #303033; --color-4: #f9f8fb; --color-5: #8c5d82. 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 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