← Back to Editor

#303732 · #5B5D51 · #B6E100 · #00B598

A 4-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

#303732

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#303732
RGB
rgb(48, 55, 50)
HSL
hsl(137, 7%, 20%)
HSB
hsb(137, 13%, 22%)
CMYK
cmyk(13%, 0%, 9%, 78%)
Oklch
oklch(32.8% 0.013 154.5)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#5B5D51

Ink Gray · DimGray · Charcoal

HEX
#5B5D51
RGB
rgb(91, 93, 81)
HSL
hsl(70, 7%, 34%)
HSB
hsb(70, 13%, 36%)
CMYK
cmyk(2%, 0%, 13%, 64%)
Oklch
oklch(47.3% 0.019 114.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#B6E100

Grass Green · GreenYellow · Olive Green

HEX
#B6E100
RGB
rgb(182, 225, 0)
HSL
hsl(71, 100%, 44%)
HSB
hsb(71, 100%, 88%)
CMYK
cmyk(19%, 0%, 100%, 12%)
Oklch
oklch(84.8% 0.207 122.5)

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

#00B598

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#00B598
RGB
rgb(0, 181, 152)
HSL
hsl(170, 100%, 35%)
HSB
hsb(170, 100%, 71%)
CMYK
cmyk(100%, 0%, 16%, 29%)
Oklch
oklch(69.1% 0.129 175.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

303732
372F35

Analogous

31372F
303732
2F3735

Triadic

303732
312F37
37312F

Split-Comp.

303732
352F37
372F31

Tetradic

303732
2F3137
372F35
37352F

Contrast Matrix WCAG 2.1 Contrast

303732
5B5D51
B6E100
00B598
—
1.8
Fail
8.0
AAA
4.7
AA
1.8
Fail
—
4.4
AA Large
2.6
Fail
8.0
AAA
4.4
AA Large
—
1.7
Fail
4.7
AA
2.6
Fail
1.7
Fail
—
White BG
12.2AAA
6.7AA
1.5Fail
2.6Fail
Black BG
1.7Fail
3.1AA Large
13.8AAA
8.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

333333
5C5C54
C9C936
4E509F

Deuteranopia

333234
5C5C55
C6C344
4436A1

Tritanopia

303434
5B5657
B8616B
09A5A6

Achromatopsia

343434
5B5B5B
BABABA
7C7C7C

Shades & Tints Shades & Tints

#303732

Dark
Light

#5B5D51

Dark
Light

#B6E100

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #303732;
  --color-2: #5b5d51;
  --color-3: #b6e100;
  --color-4: #00b598;
}

SCSS

$color-1: #303732;
$color-2: #5b5d51;
$color-3: #b6e100;
$color-4: #00b598;

TAILWIND

colors: {
  'brand-1': '#303732',
  'brand-2': '#5b5d51',
  'brand-3': '#b6e100',
  'brand-4': '#00b598',
}

RGB Array

[48, 55, 50], [91, 93, 81], [182, 225, 0], [0, 181, 152]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This general-style palette of #303732, #5B5D51, #B6E100, #00B598 is ideal for: tech websites, dark mode UIs, game UIs. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #303732; --color-2: #5b5d51; --color-3: #b6e100; --color-4: #00b598. 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. 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 4-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