← Back to Editor

#DFF79E · #BFBA24 · #8B872F · #363C50 · #04012A

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

#DFF79E

Willow Green · Khaki · Apple Green

HEX
#DFF79E
RGB
rgb(223, 247, 158)
HSL
hsl(76, 85%, 79%)
HSB
hsb(76, 36%, 97%)
CMYK
cmyk(10%, 0%, 36%, 3%)
Oklch
oklch(93.8% 0.116 121.0)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#BFBA24

Autumn Sage · GoldenRod · Honey Gold

HEX
#BFBA24
RGB
rgb(191, 186, 36)
HSL
hsl(58, 68%, 45%)
HSB
hsb(58, 81%, 75%)
CMYK
cmyk(0%, 3%, 81%, 25%)
Oklch
oklch(76.9% 0.157 107.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#8B872F

Autumn Sage · Olive · Honey Gold

HEX
#8B872F
RGB
rgb(139, 135, 47)
HSL
hsl(57, 49%, 36%)
HSB
hsb(57, 66%, 55%)
CMYK
cmyk(0%, 3%, 66%, 45%)
Oklch
oklch(60.9% 0.109 106.7)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#363C50

Indigo · DarkSlateGray · Prussian Blue

HEX
#363C50
RGB
rgb(54, 60, 80)
HSL
hsl(226, 19%, 26%)
HSB
hsb(226, 33%, 31%)
CMYK
cmyk(32%, 25%, 0%, 69%)
Oklch
oklch(35.9% 0.036 271.6)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#04012A

Deep Indigo · Black · Deep Sea Blue

HEX
#04012A
RGB
rgb(4, 1, 42)
HSL
hsl(244, 95%, 8%)
HSB
hsb(244, 98%, 16%)
CMYK
cmyk(90%, 98%, 0%, 84%)
Oklch
oklch(13.9% 0.083 273.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DFF79E
B49CF7

Analogous

F7E29C
DFF79E
B1F79C

Triadic

DFF79E
9CDFF7
F79CDF

Split-Comp.

DFF79E
9CB1F7
E29CF7

Tetradic

DFF79E
9CF7E2
B49CF7
F79CB1

Contrast Matrix WCAG 2.1 Contrast

DFF79E
BFBA24
8B872F
363C50
04012A
—
1.7
Fail
3.2
AA Large
9.3
AAA
17.2
AAA
1.7
Fail
—
1.8
Fail
5.3
AA
9.8
AAA
3.2
AA Large
1.8
Fail
—
2.9
Fail
5.4
AA
9.3
AAA
5.3
AA
2.9
Fail
—
1.8
Fail
17.2
AAA
9.8
AAA
5.4
AA
1.8
Fail
—
White BG
1.2Fail
2.0Fail
3.7AA Large
10.9AAA
20.1AAA
Black BG
17.9AAA
10.3AAA
5.6AA
1.9Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9EAB4
BDBD48
898944
39394B
030320

Deuteranopia

E8E6B9
BDBE51
8A8A49
38384A
03031E

Tritanopia

E0C5C8
BF656B
8B5559
364747
041817

Achromatopsia

E6E6E6
AAAAAA
7E7E7E
3C3C3C
070707

Shades & Tints Shades & Tints

#DFF79E

Dark
Light

#BFBA24

Dark
Light

#8B872F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dff79e;
  --color-2: #bfba24;
  --color-3: #8b872f;
  --color-4: #363c50;
  --color-5: #04012a;
}

SCSS

$color-1: #dff79e;
$color-2: #bfba24;
$color-3: #8b872f;
$color-4: #363c50;
$color-5: #04012a;

TAILWIND

colors: {
  'brand-1': '#dff79e',
  'brand-2': '#bfba24',
  'brand-3': '#8b872f',
  'brand-4': '#363c50',
  'brand-5': '#04012a',
}

RGB Array

[223, 247, 158], [191, 186, 36], [139, 135, 47], [54, 60, 80], [4, 1, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #DFF79E, #BFBA24, #8B872F, #363C50, #04012A 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: #dff79e; --color-2: #bfba24; --color-3: #8b872f; --color-4: #363c50; --color-5: #04012a. 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