← Back to Editor

#354132 · #2F6F65 · #65A85F · #B2D463 · #D9EA32

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 Library

Color Details Color Details

#354132

Celadon · DarkSlateGray · Forest Green

HEX
#354132
RGB
rgb(53, 65, 50)
HSL
hsl(108, 13%, 23%)
HSB
hsb(108, 23%, 25%)
CMYK
cmyk(18%, 0%, 23%, 75%)
Oklch
oklch(36.0% 0.030 139.4)

TraditionalCeladon」· PaintForest Green」· Creative Blush Sunrise

#2F6F65

Mineral Blue · SeaGreen · Mint Ice

HEX
#2F6F65
RGB
rgb(47, 111, 101)
HSL
hsl(171, 41%, 31%)
HSB
hsb(171, 58%, 44%)
CMYK
cmyk(58%, 0%, 9%, 56%)
Oklch
oklch(49.7% 0.068 181.7)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#65A85F

Celadon · MediumSeaGreen · Olive Green

HEX
#65A85F
RGB
rgb(101, 168, 95)
HSL
hsl(115, 30%, 52%)
HSB
hsb(115, 43%, 66%)
CMYK
cmyk(40%, 0%, 43%, 34%)
Oklch
oklch(66.9% 0.125 142.3)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#B2D463

Willow Green · Tan · Apple Green

HEX
#B2D463
RGB
rgb(178, 212, 99)
HSL
hsl(78, 57%, 61%)
HSB
hsb(78, 53%, 83%)
CMYK
cmyk(16%, 0%, 53%, 17%)
Oklch
oklch(82.2% 0.146 123.5)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#D9EA32

Autumn Sage · GreenYellow · Sunflower

HEX
#D9EA32
RGB
rgb(217, 234, 50)
HSL
hsl(66, 81%, 56%)
HSB
hsb(66, 79%, 92%)
CMYK
cmyk(7%, 0%, 79%, 8%)
Oklch
oklch(89.5% 0.191 115.1)

TraditionalAutumn Sage」· PaintSunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

354132
3F3342

Analogous

3E4233
354132
334238

Triadic

354132
333642
423336

Split-Comp.

354132
383342
42333E

Tetradic

354132
333E42
3F3342
423833

Contrast Matrix WCAG 2.1 Contrast

354132
2F6F65
65A85F
B2D463
D9EA32
1.8
Fail
3.7
AA Large
6.4
AA
8.1
AAA
1.8
Fail
2.0
Fail
3.5
AA Large
4.4
AA Large
3.7
AA Large
2.0
Fail
1.7
Fail
2.2
Fail
6.4
AA
3.5
AA Large
1.7
Fail
1.3
Fail
8.1
AAA
4.4
AA Large
2.2
Fail
1.3
Fail
White BG
10.7AAA
5.9AA
2.9Fail
1.7Fail
1.3Fail
Black BG
2.0Fail
3.6AA Large
7.3AAA
12.5AAA
15.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3A3A36
4B4B67
828371
C1C17E
E0E15F

Deuteranopia

3A3937
474268
7E7975
BFBC85
DFDE69

Tritanopia

363839
32696A
687F82
B49499
DA8289

Achromatopsia

3C3C3C
5B5B5B
8C8C8C
BDBDBD
D0D0D0

Shades & Tints Shades & Tints

#354132

Dark
Light

#2F6F65

Dark
Light

#65A85F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #354132;
  --color-2: #2f6f65;
  --color-3: #65a85f;
  --color-4: #b2d463;
  --color-5: #d9ea32;
}

SCSS

$color-1: #354132;
$color-2: #2f6f65;
$color-3: #65a85f;
$color-4: #b2d463;
$color-5: #d9ea32;

TAILWIND

colors: {
  'brand-1': '#354132',
  'brand-2': '#2f6f65',
  'brand-3': '#65a85f',
  'brand-4': '#b2d463',
  'brand-5': '#d9ea32',
}

RGB Array

[53, 65, 50], [47, 111, 101], [101, 168, 95], [178, 212, 99], [217, 234, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #354132, #2F6F65, #65A85F, #B2D463, #D9EA32 is ideal for: corporate websites, product showcases, portfolios. 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: #354132; --color-2: #2f6f65; --color-3: #65a85f; --color-4: #b2d463; --color-5: #d9ea32. 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. 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