← Back to Editor

#04394C · #331B05 · #2BC9FE · #CCA498 · #0D0101

space

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#04394C

Lake Blue · DarkSlateGray · Peacock Green

HEX
#04394C
RGB
rgb(4, 57, 76)
HSL
hsl(196, 90%, 16%)
HSB
hsb(196, 95%, 30%)
CMYK
cmyk(95%, 25%, 0%, 70%)
Oklch
oklch(32.3% 0.061 228.7)

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

#331B05

Tangerine · Black · Cinnamon

HEX
#331B05
RGB
rgb(51, 27, 5)
HSL
hsl(29, 82%, 11%)
HSB
hsb(29, 90%, 20%)
CMYK
cmyk(0%, 47%, 90%, 80%)
Oklch
oklch(25.0% 0.051 60.1)

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

#2BC9FE

Lake Blue · DeepSkyBlue · Lake Green

HEX
#2BC9FE
RGB
rgb(43, 201, 254)
HSL
hsl(195, 99%, 58%)
HSB
hsb(195, 83%, 100%)
CMYK
cmyk(83%, 21%, 0%, 0%)
Oklch
oklch(78.2% 0.142 227.0)

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

#CCA498

Peach Pink · Tan · Coral Red

HEX
#CCA498
RGB
rgb(204, 164, 152)
HSL
hsl(14, 34%, 70%)
HSB
hsb(14, 25%, 80%)
CMYK
cmyk(0%, 20%, 25%, 20%)
Oklch
oklch(75.2% 0.051 37.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#0D0101

Vermilion · Black · Deep Berry

HEX
#0D0101
RGB
rgb(13, 1, 1)
HSL
hsl(0, 86%, 3%)
HSB
hsb(0, 92%, 5%)
CMYK
cmyk(0%, 92%, 92%, 95%)
Oklch
oklch(10.7% 0.034 25.0)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

04394C
4E1804

Analogous

044E3C
04394C
04154E

Triadic

04394C
4E043A
3A4E04

Split-Comp.

04394C
4E0415
4E3C04

Tetradic

04394C
3C044E
4E1804
154E04

Contrast Matrix WCAG 2.1 Contrast

04394C
331B05
2BC9FE
CCA498
0D0101
—
1.3
Fail
6.4
AA
5.5
AA
1.7
Fail
1.3
Fail
—
8.4
AAA
7.2
AAA
1.3
Fail
6.4
AA
8.4
AAA
—
1.2
Fail
10.7
AAA
5.5
AA
7.2
AAA
1.2
Fail
—
9.1
AAA
1.7
Fail
1.3
Fail
10.7
AAA
9.1
AAA
—
White BG
12.4AAA
16.2AAA
1.9Fail
2.3Fail
20.6AAA
Black BG
1.7Fail
1.3Fail
10.9AAA
9.3AAA
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

1B1B47
29280A
6F71F1
BBBA9B
080801

Deuteranopia

181446
2A2C0C
665AEE
BDC09C
090901

Tritanopia

074443
320F0F
33E7E5
CA9D9E
0C0101

Achromatopsia

2B2B2B
202020
A0A0A0
AFAFAF
050505

Shades & Tints Shades & Tints

#04394C

Dark
Light

#331B05

Dark
Light

#2BC9FE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #04394c;
  --color-2: #331b05;
  --color-3: #2bc9fe;
  --color-4: #cca498;
  --color-5: #0d0101;
}

SCSS

$color-1: #04394c;
$color-2: #331b05;
$color-3: #2bc9fe;
$color-4: #cca498;
$color-5: #0d0101;

TAILWIND

colors: {
  'brand-1': '#04394c',
  'brand-2': '#331b05',
  'brand-3': '#2bc9fe',
  'brand-4': '#cca498',
  'brand-5': '#0d0101',
}

RGB Array

[4, 57, 76], [51, 27, 5], [43, 201, 254], [204, 164, 152], [13, 1, 1]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #04394C, #331B05, #2BC9FE, #CCA498, #0D0101 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #04394c; --color-2: #331b05; --color-3: #2bc9fe; --color-4: #cca498; --color-5: #0d0101. 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 space-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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