← Back to Editor

#0F422C · #186A46 · #5DAB59 · #B5D65A · #EBE858

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#0F422C

Mineral Blue · DarkSlateGray · Dark Green

HEX
#0F422C
RGB
rgb(15, 66, 44)
HSL
hsl(154, 63%, 16%)
HSB
hsb(154, 77%, 26%)
CMYK
cmyk(77%, 0%, 33%, 74%)
Oklch
oklch(33.9% 0.066 160.6)

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

#186A46

Mineral Blue · DarkSlateGray · Forest Green

HEX
#186A46
RGB
rgb(24, 106, 70)
HSL
hsl(154, 63%, 25%)
HSB
hsb(154, 77%, 42%)
CMYK
cmyk(77%, 0%, 34%, 58%)
Oklch
oklch(46.7% 0.097 159.3)

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

#5DAB59

Celadon · MediumSeaGreen · Olive Green

HEX
#5DAB59
RGB
rgb(93, 171, 89)
HSL
hsl(117, 33%, 51%)
HSB
hsb(117, 48%, 67%)
CMYK
cmyk(46%, 0%, 48%, 33%)
Oklch
oklch(67.1% 0.140 142.9)

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

#B5D65A

Grass Green · GreenYellow · Olive Green

HEX
#B5D65A
RGB
rgb(181, 214, 90)
HSL
hsl(76, 60%, 60%)
HSB
hsb(76, 58%, 84%)
CMYK
cmyk(15%, 0%, 58%, 16%)
Oklch
oklch(82.7% 0.155 122.4)

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

#EBE858

Fresh Green · Khaki · Sunflower

HEX
#EBE858
RGB
rgb(235, 232, 88)
HSL
hsl(59, 79%, 63%)
HSB
hsb(59, 63%, 92%)
CMYK
cmyk(0%, 1%, 63%, 8%)
Oklch
oklch(90.7% 0.162 108.1)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0F422C
430F25

Analogous

0F4313
0F422C
0F3F43

Triadic

0F422C
2C0F43
432C0F

Split-Comp.

0F422C
430F3F
43130F

Tetradic

0F422C
130F43
430F25
3F430F

Contrast Matrix WCAG 2.1 Contrast

0F422C
186A46
5DAB59
B5D65A
EBE858
—
1.7
Fail
4.0
AA Large
6.9
AA
8.8
AAA
1.7
Fail
—
2.3
Fail
4.0
AA Large
5.1
AA
4.0
AA Large
2.3
Fail
—
1.7
Fail
2.2
Fail
6.9
AA
4.0
AA Large
1.7
Fail
—
1.3
Fail
8.8
AAA
5.1
AA
2.2
Fail
1.3
Fail
—
White BG
11.4AAA
6.6AA
2.8Fail
1.6Fail
1.3Fail
Black BG
1.8Fail
3.2AA Large
7.4AAA
12.7AAA
16.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

252631
3C3C4F
7F7F6D
C3C478
EAEA7B

Deuteranopia

221E33
373151
7A7472
C1BF7F
EAEA83

Tritanopia

123636
1C5657
617D80
B79095
EB969C

Achromatopsia

303030
4D4D4D
8A8A8A
BEBEBE
D8D8D8

Shades & Tints Shades & Tints

#0F422C

Dark
Light

#186A46

Dark
Light

#5DAB59

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0f422c;
  --color-2: #186a46;
  --color-3: #5dab59;
  --color-4: #b5d65a;
  --color-5: #ebe858;
}

SCSS

$color-1: #0f422c;
$color-2: #186a46;
$color-3: #5dab59;
$color-4: #b5d65a;
$color-5: #ebe858;

TAILWIND

colors: {
  'brand-1': '#0f422c',
  'brand-2': '#186a46',
  'brand-3': '#5dab59',
  'brand-4': '#b5d65a',
  'brand-5': '#ebe858',
}

RGB Array

[15, 66, 44], [24, 106, 70], [93, 171, 89], [181, 214, 90], [235, 232, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #0F422C, #186A46, #5DAB59, #B5D65A, #EBE858 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #0f422c; --color-2: #186a46; --color-3: #5dab59; --color-4: #b5d65a; --color-5: #ebe858. 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 tech, SaaS, healthcare, eco industries. 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