← Back to Editor

#09101F · #124E6A · #2BBCAF · #8BE57A · #BADE2E

space

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#09101F

Indigo · Black · Deep Sea Blue

HEX
#09101F
RGB
rgb(9, 16, 31)
HSL
hsl(221, 55%, 8%)
HSB
hsb(221, 71%, 12%)
CMYK
cmyk(71%, 48%, 0%, 88%)
Oklch
oklch(17.5% 0.033 264.2)

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

#124E6A

Lake Blue · DarkSlateGray · Peacock Green

HEX
#124E6A
RGB
rgb(18, 78, 106)
HSL
hsl(199, 71%, 24%)
HSB
hsb(199, 83%, 42%)
CMYK
cmyk(83%, 26%, 0%, 58%)
Oklch
oklch(40.1% 0.075 234.0)

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

#2BBCAF

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#2BBCAF
RGB
rgb(43, 188, 175)
HSL
hsl(175, 63%, 45%)
HSB
hsb(175, 77%, 74%)
CMYK
cmyk(77%, 0%, 7%, 26%)
Oklch
oklch(72.0% 0.118 185.7)

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

#8BE57A

Emerald · LightGreen · Apple Green

HEX
#8BE57A
RGB
rgb(139, 229, 122)
HSL
hsl(110, 67%, 69%)
HSB
hsb(110, 47%, 90%)
CMYK
cmyk(39%, 0%, 47%, 10%)
Oklch
oklch(84.1% 0.167 140.5)

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

#BADE2E

Grass Green · GreenYellow · Olive Green

HEX
#BADE2E
RGB
rgb(186, 222, 46)
HSL
hsl(72, 73%, 53%)
HSB
hsb(72, 79%, 87%)
CMYK
cmyk(16%, 0%, 79%, 13%)
Oklch
oklch(84.5% 0.191 121.2)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

09101F
201909

Analogous

091C20
09101F
0D0920

Triadic

09101F
200910
102009

Split-Comp.

09101F
200D09
1C2009

Tetradic

09101F
20091C
201909
09200D

Contrast Matrix WCAG 2.1 Contrast

09101F
124E6A
2BBCAF
8BE57A
BADE2E
—
2.1
Fail
8.1
AAA
12.3
AAA
12.3
AAA
2.1
Fail
—
3.8
AA Large
5.8
AA
5.8
AA
8.1
AAA
3.8
AA Large
—
1.5
Fail
1.5
Fail
12.3
AAA
5.8
AA
1.5
Fail
—
1.0
Fail
12.3
AAA
5.8
AA
1.5
Fail
1.0
Fail
—
White BG
19.0AAA
9.0AAA
2.4Fail
1.5Fail
1.5Fail
Black BG
1.1Fail
2.3Fail
8.9AAA
13.6AAA
13.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0C0C1B
2C2D63
6A6BB2
B2B394
CACA59

Deuteranopia

0C0B1B
292462
6157B3
ADA69A
C8C563

Tritanopia

091918
155E5D
32B5B5
8FA8AD
BC7A82

Achromatopsia

101010
3F3F3F
8F8F8F
BEBEBE
BFBFBF

Shades & Tints Shades & Tints

#09101F

Dark
Light

#124E6A

Dark
Light

#2BBCAF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #09101f;
  --color-2: #124e6a;
  --color-3: #2bbcaf;
  --color-4: #8be57a;
  --color-5: #bade2e;
}

SCSS

$color-1: #09101f;
$color-2: #124e6a;
$color-3: #2bbcaf;
$color-4: #8be57a;
$color-5: #bade2e;

TAILWIND

colors: {
  'brand-1': '#09101f',
  'brand-2': '#124e6a',
  'brand-3': '#2bbcaf',
  'brand-4': '#8be57a',
  'brand-5': '#bade2e',
}

RGB Array

[9, 16, 31], [18, 78, 106], [43, 188, 175], [139, 229, 122], [186, 222, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #09101F, #124E6A, #2BBCAF, #8BE57A, #BADE2E 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: #09101f; --color-2: #124e6a; --color-3: #2bbcaf; --color-4: #8be57a; --color-5: #bade2e. 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