#4B998B + #72C58D + #ADE18F + #D6F190 + #976367 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#4B998B

Mineral Blue · CadetBlue · Mint Ice

HEX

#4B998B

RGB

rgb(75, 153, 139)

HSL

hsl(169, 34%, 45%)

HSB

hsb(169, 51%, 60%)

CMYK

cmyk(51%, 0%, 9%, 40%)

Oklch

oklch(62.9% 0.080 180.3)

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

#72C58D

Celadon · DarkSeaGreen · Apple Green

HEX

#72C58D

RGB

rgb(114, 197, 141)

HSL

hsl(140, 42%, 61%)

HSB

hsb(140, 42%, 77%)

CMYK

cmyk(42%, 0%, 28%, 23%)

Oklch

oklch(75.6% 0.115 153.3)

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

#ADE18F

Emerald · LightGreen · Apple Green

HEX

#ADE18F

RGB

rgb(173, 225, 143)

HSL

hsl(98, 58%, 72%)

HSB

hsb(98, 36%, 88%)

CMYK

cmyk(23%, 0%, 36%, 12%)

Oklch

oklch(85.4% 0.121 134.7)

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

#D6F190

Willow Green · Khaki · Apple Green

HEX

#D6F190

RGB

rgb(214, 241, 144)

HSL

hsl(77, 78%, 75%)

HSB

hsb(77, 40%, 95%)

CMYK

cmyk(11%, 0%, 40%, 5%)

Oklch

oklch(91.7% 0.126 121.6)

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

#976367

Crimson · Gray · Passion Red

HEX

#976367

RGB

rgb(151, 99, 103)

HSL

hsl(355, 21%, 49%)

HSB

hsb(355, 34%, 59%)

CMYK

cmyk(0%, 34%, 32%, 41%)

Oklch

oklch(55.7% 0.068 14.4)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B998B

9A4C5A

Analogous

4C9A64

4B998B

4C819A

Triadic

4B998B

8B4C9A

9A8B4C

Split-Comp.

4B998B

9A4C81

9A644C

Tetradic

4B998B

644C9A

9A4C5A

819A4C

Contrast Matrix WCAG 2.1 Contrast

4B998B	72C58D	ADE18F	D6F190	976367
—	1.6 Fail	2.2 Fail	2.7 Fail	1.4 Fail
1.6 Fail	—	1.4 Fail	1.7 Fail	2.3 Fail
2.2 Fail	1.4 Fail	—	1.2 Fail	3.2 AA Large
2.7 Fail	1.7 Fail	1.2 Fail	—	3.9 AA Large
1.4 Fail	2.3 Fail	3.2 AA Large	3.9 AA Large	—

White BG

3.4AA Large

2.1Fail

1.5Fail

1.2Fail

4.9AA

Black BG

6.2AA

10.1AAA

13.9AAA

16.8AAA

4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

6D6D8E

96979B

C4C4A3

E2E2A7

808066

Deuteranopia

68628F

918B9E

C1BDA8

E0DEAD

848766

Tritanopia

4F9192

76A5A8

B0B3B6

D7BABE

946565

Achromatopsia

808080

A6A6A6

C8C8C8

DEDEDE

737373

Shades & Tints Shades & Tints

#4B998B

Dark

Light

#72C58D

Dark

Light

#ADE18F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b998b;
  --color-2: #72c58d;
  --color-3: #ade18f;
  --color-4: #d6f190;
  --color-5: #976367;
}

SCSS

$color-1: #4b998b;
$color-2: #72c58d;
$color-3: #ade18f;
$color-4: #d6f190;
$color-5: #976367;

TAILWIND

colors: {
  'brand-1': '#4b998b',
  'brand-2': '#72c58d',
  'brand-3': '#ade18f',
  'brand-4': '#d6f190',
  'brand-5': '#976367',
}

RGB Array

[75, 153, 139], [114, 197, 141], [173, 225, 143], [214, 241, 144], [151, 99, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4B998B, #72C58D, #ADE18F, #D6F190, #976367 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: #4b998b; --color-2: #72c58d; --color-3: #ade18f; --color-4: #d6f190; --color-5: #976367. 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