#8E9E97 + #7CB99F + #EB9BA7 + #FABDA2 + #E1E6C5 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8E9E97

Mineral Blue · DarkSeaGreen · Silver Sand

HEX

#8E9E97

RGB

rgb(142, 158, 151)

HSL

hsl(154, 8%, 59%)

HSB

hsb(154, 10%, 62%)

CMYK

cmyk(10%, 0%, 4%, 38%)

Oklch

oklch(68.4% 0.021 167.6)

Traditional「Mineral Blue」· Paint「Silver Sand」· Creative Urban Concrete

#7CB99F

Jade · DarkSeaGreen · Apple Green

HEX

#7CB99F

RGB

rgb(124, 185, 159)

HSL

hsl(154, 30%, 61%)

HSB

hsb(154, 33%, 73%)

CMYK

cmyk(33%, 0%, 14%, 27%)

Oklch

oklch(73.7% 0.074 165.9)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#EB9BA7

Peach Pink · LightPink · Coral Red

HEX

#EB9BA7

RGB

rgb(235, 155, 167)

HSL

hsl(351, 67%, 76%)

HSB

hsb(351, 34%, 92%)

CMYK

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

Oklch

oklch(77.2% 0.097 9.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FABDA2

Apricot · LightPink · Peach Orange

HEX

#FABDA2

RGB

rgb(250, 189, 162)

HSL

hsl(18, 90%, 81%)

HSB

hsb(18, 35%, 98%)

CMYK

cmyk(0%, 24%, 35%, 2%)

Oklch

oklch(84.7% 0.080 45.0)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E1E6C5

Fresh Green · LightGray · Lemon Cream

HEX

#E1E6C5

RGB

rgb(225, 230, 197)

HSL

hsl(69, 40%, 84%)

HSB

hsb(69, 14%, 90%)

CMYK

cmyk(2%, 0%, 14%, 10%)

Oklch

oklch(91.2% 0.044 114.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8E9E97

9F8E95

Analogous

8E9F8F

8E9E97

8E9E9F

Triadic

8E9E97

988E9F

9F988E

Split-Comp.

8E9E97

9F8E9E

9F8F8E

Tetradic

8E9E97

8F8E9F

9F8E95

9E9F8E

Contrast Matrix WCAG 2.1 Contrast

8E9E97	7CB99F	EB9BA7	FABDA2	E1E6C5
—	1.2 Fail	1.3 Fail	1.7 Fail	2.2 Fail
1.2 Fail	—	1.1 Fail	1.4 Fail	1.8 Fail
1.3 Fail	1.1 Fail	—	1.3 Fail	1.7 Fail
1.7 Fail	1.4 Fail	1.3 Fail	—	1.3 Fail
2.2 Fail	1.8 Fail	1.7 Fail	1.3 Fail	—

White BG

2.8Fail

2.3Fail

2.1Fail

1.6Fail

1.3Fail

Black BG

7.5AAA

9.3AAA

9.8AAA

12.9AAA

16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

959599

9697A5

C8C8A4

E0DFA9

E3E3CD

Deuteranopia

949399

938EA7

CDD3A3

E3E8AA

E3E3CF

Tritanopia

8F9A9A

7FAAAB

E7A2A1

F7AEAF

E1D3D5

Achromatopsia

989898

A4A4A4

B4B4B4

CCCCCC

E1E1E1

Shades & Tints Shades & Tints

#8E9E97

Dark

Light

#7CB99F

Dark

Light

#EB9BA7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8e9e97;
  --color-2: #7cb99f;
  --color-3: #eb9ba7;
  --color-4: #fabda2;
  --color-5: #e1e6c5;
}

SCSS

$color-1: #8e9e97;
$color-2: #7cb99f;
$color-3: #eb9ba7;
$color-4: #fabda2;
$color-5: #e1e6c5;

TAILWIND

colors: {
  'brand-1': '#8e9e97',
  'brand-2': '#7cb99f',
  'brand-3': '#eb9ba7',
  'brand-4': '#fabda2',
  'brand-5': '#e1e6c5',
}

RGB Array

[142, 158, 151], [124, 185, 159], [235, 155, 167], [250, 189, 162], [225, 230, 197]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8E9E97, #7CB99F, #EB9BA7, #FABDA2, #E1E6C5 is ideal for: health products, baby brands, fresh-style blogs. 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: #8e9e97; --color-2: #7cb99f; --color-3: #eb9ba7; --color-4: #fabda2; --color-5: #e1e6c5. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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