← Back to Editor

#332E05 · #0F6650 · #24B394 · #8FD957 · #B6FF8C

A 5-color palette 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

#332E05

Autumn Sage · Black · Amber Gold

HEX
#332E05
RGB
rgb(51, 46, 5)
HSL
hsl(53, 82%, 11%)
HSB
hsb(53, 90%, 20%)
CMYK
cmyk(0%, 10%, 90%, 80%)
Oklch
oklch(29.8% 0.057 102.2)

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

#0F6650

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#0F6650
RGB
rgb(15, 102, 80)
HSL
hsl(165, 74%, 23%)
HSB
hsb(165, 85%, 40%)
CMYK
cmyk(85%, 0%, 22%, 60%)
Oklch
oklch(45.6% 0.085 170.4)

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

#24B394

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#24B394
RGB
rgb(36, 179, 148)
HSL
hsl(167, 67%, 42%)
HSB
hsb(167, 80%, 70%)
CMYK
cmyk(80%, 0%, 17%, 30%)
Oklch
oklch(68.7% 0.124 173.5)

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

#8FD957

Emerald · LightGreen · Olive Green

HEX
#8FD957
RGB
rgb(143, 217, 87)
HSL
hsl(94, 63%, 60%)
HSB
hsb(94, 60%, 85%)
CMYK
cmyk(34%, 0%, 60%, 15%)
Oklch
oklch(81.0% 0.179 133.9)

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

#B6FF8C

Emerald · LightGreen · Apple Green

HEX
#B6FF8C
RGB
rgb(182, 255, 140)
HSL
hsl(98, 100%, 77%)
HSB
hsb(98, 45%, 100%)
CMYK
cmyk(29%, 0%, 45%, 0%)
Oklch
oklch(92.7% 0.164 135.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

332E05
050A33

Analogous

331705
332E05
213305

Triadic

332E05
05332E
2E0533

Split-Comp.

332E05
052133
170533

Tetradic

332E05
053317
050A33
330521

Contrast Matrix WCAG 2.1 Contrast

332E05
0F6650
24B394
8FD957
B6FF8C
—
2.0
Fail
5.2
AA
8.0
AAA
11.5
AAA
2.0
Fail
—
2.6
Fail
4.0
AA Large
5.8
AA
5.2
AA
2.6
Fail
—
1.5
Fail
2.2
Fail
8.0
AAA
4.0
AA Large
1.5
Fail
—
1.4
Fail
11.5
AAA
5.8
AA
2.2
Fail
1.4
Fail
—
White BG
13.7AAA
6.9AA
2.6Fail
1.7Fail
1.2Fail
Black BG
1.5Fail
3.0AA Large
8.0AAA
12.2AAA
17.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

31310F
353555
62639C
AFB076
D6D6A8

Deuteranopia

313111
302957
5A4F9D
ABA57E
D1CCAF

Tritanopia

331718
135A5A
2BA1A3
938F95
BABEC3

Achromatopsia

2B2B2B
494949
858585
B4B4B4
DCDCDC

Shades & Tints Shades & Tints

#332E05

Dark
Light

#0F6650

Dark
Light

#24B394

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #332e05;
  --color-2: #0f6650;
  --color-3: #24b394;
  --color-4: #8fd957;
  --color-5: #b6ff8c;
}

SCSS

$color-1: #332e05;
$color-2: #0f6650;
$color-3: #24b394;
$color-4: #8fd957;
$color-5: #b6ff8c;

TAILWIND

colors: {
  'brand-1': '#332e05',
  'brand-2': '#0f6650',
  'brand-3': '#24b394',
  'brand-4': '#8fd957',
  'brand-5': '#b6ff8c',
}

RGB Array

[51, 46, 5], [15, 102, 80], [36, 179, 148], [143, 217, 87], [182, 255, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #332E05, #0F6650, #24B394, #8FD957, #B6FF8C is ideal for: social media posters, mobile apps, e-commerce promos, 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: #332e05; --color-2: #0f6650; --color-3: #24b394; --color-4: #8fd957; --color-5: #b6ff8c. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 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