#8BC590 + #39A89B + #FDE778 + #5A6656 + #278871 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8BC590

Celadon · DarkSeaGreen · Apple Green

HEX

#8BC590

RGB

rgb(139, 197, 144)

HSL

hsl(125, 33%, 66%)

HSB

hsb(125, 29%, 77%)

CMYK

cmyk(29%, 0%, 27%, 23%)

Oklch

oklch(76.9% 0.096 146.7)

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

#39A89B

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#39A89B

RGB

rgb(57, 168, 155)

HSL

hsl(173, 49%, 44%)

HSB

hsb(173, 66%, 66%)

CMYK

cmyk(66%, 0%, 8%, 34%)

Oklch

oklch(66.6% 0.101 184.1)

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

#FDE778

Fresh Green · Khaki · Sunflower

HEX

#FDE778

RGB

rgb(253, 231, 120)

HSL

hsl(50, 97%, 73%)

HSB

hsb(50, 53%, 99%)

CMYK

cmyk(0%, 9%, 53%, 1%)

Oklch

oklch(92.4% 0.134 98.3)

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

#5A6656

Celadon · DimGray · Charcoal

HEX

#5A6656

RGB

rgb(90, 102, 86)

HSL

hsl(105, 9%, 37%)

HSB

hsb(105, 16%, 40%)

CMYK

cmyk(12%, 0%, 16%, 60%)

Oklch

oklch(49.5% 0.029 137.9)

Traditional「Celadon」· Paint「Charcoal」· Creative Midnight Shadow

#278871

Mineral Blue · SeaGreen · Mint Ice

HEX

#278871

RGB

rgb(39, 136, 113)

HSL

hsl(166, 55%, 34%)

HSB

hsb(166, 71%, 53%)

CMYK

cmyk(71%, 0%, 17%, 47%)

Oklch

oklch(56.5% 0.095 173.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8BC590

C58CC0

Analogous

A4C58C

8BC590

8CC5AD

Triadic

8BC590

908CC5

C5908C

Split-Comp.

8BC590

AD8CC5

C58CA4

Tetradic

8BC590

8CA4C5

C58CC0

C5AD8C

Contrast Matrix WCAG 2.1 Contrast

8BC590	39A89B	FDE778	5A6656	278871
—	1.4 Fail	1.6 Fail	3.0 AA Large	2.2 Fail
1.4 Fail	—	2.3 Fail	2.1 Fail	1.5 Fail
1.6 Fail	2.3 Fail	—	4.9 AA	3.5 AA Large
3.0 AA Large	2.1 Fail	4.9 AA	—	1.4 Fail
2.2 Fail	1.5 Fail	3.5 AA Large	1.4 Fail	—

White BG

2.0Fail

2.9Fail

1.2Fail

6.1AA

4.3AA Large

Black BG

10.5AAA

7.2AAA

16.9AAA

3.5AA Large

4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A59D

696A9E

F3F393

5F5F5A

515277

Deuteranopia

A19CA0

635A9F

F5F699

5F5E5B

4B4478

Tritanopia

8EA7A9

3FA1A1

FCA8AD

5B5D5E

2C7B7C

Achromatopsia

AEAEAE

858585

E1E1E1

616161

686868

Shades & Tints Shades & Tints

#8BC590

Dark

Light

#39A89B

Dark

Light

#FDE778

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8bc590;
  --color-2: #39a89b;
  --color-3: #fde778;
  --color-4: #5a6656;
  --color-5: #278871;
}

SCSS

$color-1: #8bc590;
$color-2: #39a89b;
$color-3: #fde778;
$color-4: #5a6656;
$color-5: #278871;

TAILWIND

colors: {
  'brand-1': '#8bc590',
  'brand-2': '#39a89b',
  'brand-3': '#fde778',
  'brand-4': '#5a6656',
  'brand-5': '#278871',
}

RGB Array

[139, 197, 144], [57, 168, 155], [253, 231, 120], [90, 102, 86], [39, 136, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8BC590, #39A89B, #FDE778, #5A6656, #278871 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: #8bc590; --color-2: #39a89b; --color-3: #fde778; --color-4: #5a6656; --color-5: #278871. 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