← Back to Editor

#184341 · #275342 · #436D3F · #B1C746 · #FFFF47

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#184341

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#184341
RGB
rgb(24, 67, 65)
HSL
hsl(177, 47%, 18%)
HSB
hsb(177, 64%, 26%)
CMYK
cmyk(64%, 0%, 3%, 74%)
Oklch
oklch(35.2% 0.047 191.0)

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

#275342

Mineral Blue · DarkSlateGray · Forest Green

HEX
#275342
RGB
rgb(39, 83, 66)
HSL
hsl(157, 36%, 24%)
HSB
hsb(157, 53%, 33%)
CMYK
cmyk(53%, 0%, 20%, 67%)
Oklch
oklch(40.5% 0.057 166.2)

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

#436D3F

Celadon · DarkOliveGreen · Forest Green

HEX
#436D3F
RGB
rgb(67, 109, 63)
HSL
hsl(115, 27%, 34%)
HSB
hsb(115, 42%, 43%)
CMYK
cmyk(39%, 0%, 42%, 57%)
Oklch
oklch(49.1% 0.085 142.2)

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

#B1C746

Grass Green · GreenYellow · Olive Green

HEX
#B1C746
RGB
rgb(177, 199, 70)
HSL
hsl(70, 54%, 53%)
HSB
hsb(70, 65%, 78%)
CMYK
cmyk(11%, 0%, 65%, 22%)
Oklch
oklch(78.9% 0.154 118.4)

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

#FFFF47

Fresh Green · Yellow · Sunflower

HEX
#FFFF47
RGB
rgb(255, 255, 71)
HSL
hsl(60, 100%, 64%)
HSB
hsb(60, 72%, 100%)
CMYK
cmyk(0%, 0%, 72%, 0%)
Oklch
oklch(97.0% 0.191 109.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

184341
43181A

Analogous

18432C
184341
183043

Triadic

184341
411843
434118

Split-Comp.

184341
431830
432C18

Tetradic

184341
2C1843
43181A
304318

Contrast Matrix WCAG 2.1 Contrast

184341
275342
436D3F
B1C746
FFFF47
—
1.3
Fail
1.8
Fail
5.8
AA
10.2
AAA
1.3
Fail
—
1.5
Fail
4.6
AA
8.2
AAA
1.8
Fail
1.5
Fail
—
3.2
AA Large
5.6
AA
5.8
AA
4.6
AA
3.2
AA Large
—
1.8
Fail
10.2
AAA
8.2
AAA
5.6
AA
1.8
Fail
—
White BG
10.9AAA
8.7AAA
6.0AA
1.9Fail
1.1Fail
Black BG
1.9Fail
2.4Fail
3.5AA Large
11.1AAA
19.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B41
3A3A46
55564A
BBBB65
FFFF74

Deuteranopia

282542
383447
53504D
B9B86D
FFFF7E

Tritanopia

1A4242
29494A
455355
B27E83
FF979E

Achromatopsia

363636
444444
5B5B5B
B2B2B2
EAEAEA

Shades & Tints Shades & Tints

#184341

Dark
Light

#275342

Dark
Light

#436D3F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #184341;
  --color-2: #275342;
  --color-3: #436d3f;
  --color-4: #b1c746;
  --color-5: #ffff47;
}

SCSS

$color-1: #184341;
$color-2: #275342;
$color-3: #436d3f;
$color-4: #b1c746;
$color-5: #ffff47;

TAILWIND

colors: {
  'brand-1': '#184341',
  'brand-2': '#275342',
  'brand-3': '#436d3f',
  'brand-4': '#b1c746',
  'brand-5': '#ffff47',
}

RGB Array

[24, 67, 65], [39, 83, 66], [67, 109, 63], [177, 199, 70], [255, 255, 71]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #184341, #275342, #436D3F, #B1C746, #FFFF47 is ideal for: tech websites, dark mode UIs, game UIs, 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: #184341; --color-2: #275342; --color-3: #436d3f; --color-4: #b1c746; --color-5: #ffff47. 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 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