#8E9195 + #BEBAB4 + #F0E5F2 + #F7B772 + #F79572 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8E9195

Ash · LightSlateGray · Silver Sand

HEX

#8E9195

RGB

rgb(142, 145, 149)

HSL

hsl(214, 3%, 57%)

HSB

hsb(214, 5%, 58%)

CMYK

cmyk(5%, 3%, 0%, 42%)

Oklch

oklch(65.5% 0.007 255.5)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#BEBAB4

Silver Gray · Silver · Pearl Gray

HEX

#BEBAB4

RGB

rgb(190, 186, 180)

HSL

hsl(36, 7%, 73%)

HSB

hsb(36, 5%, 75%)

CMYK

cmyk(0%, 2%, 5%, 25%)

Oklch

oklch(79.0% 0.010 78.3)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#F0E5F2

Lilac · Lavender · Lavender

HEX

#F0E5F2

RGB

rgb(240, 229, 242)

HSL

hsl(291, 33%, 92%)

HSB

hsb(291, 5%, 95%)

CMYK

cmyk(1%, 5%, 0%, 5%)

Oklch

oklch(93.4% 0.021 321.0)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

#F7B772

Goose Yellow · LightSalmon · Warm Sun

HEX

#F7B772

RGB

rgb(247, 183, 114)

HSL

hsl(31, 89%, 71%)

HSB

hsb(31, 54%, 97%)

CMYK

cmyk(0%, 26%, 54%, 3%)

Oklch

oklch(82.4% 0.114 67.2)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#F79572

Apricot · LightSalmon · Warm Sun

HEX

#F79572

RGB

rgb(247, 149, 114)

HSL

hsl(16, 89%, 71%)

HSB

hsb(16, 54%, 97%)

CMYK

cmyk(0%, 40%, 54%, 3%)

Oklch

oklch(76.4% 0.128 40.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8E9195

95928E

Analogous

8E9495

8E9195

8E8E95

Triadic

8E9195

958E91

91958E

Split-Comp.

8E9195

958E8E

94958E

Tetradic

8E9195

958E94

95928E

8E958E

Contrast Matrix WCAG 2.1 Contrast

8E9195	BEBAB4	F0E5F2	F7B772	F79572
—	1.6 Fail	2.6 Fail	1.8 Fail	1.4 Fail
1.6 Fail	—	1.6 Fail	1.1 Fail	1.1 Fail
2.6 Fail	1.6 Fail	—	1.4 Fail	1.8 Fail
1.8 Fail	1.1 Fail	1.4 Fail	—	1.3 Fail
1.4 Fail	1.1 Fail	1.8 Fail	1.3 Fail	—

White BG

3.2AA Large

1.9Fail

1.2Fail

1.8Fail

2.2Fail

Black BG

6.6AA

10.9AAA

17.2AAA

12.0AAA

9.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8F94

BCBCB5

EBEBEF

DBDB83

CDCC7A

Deuteranopia

8F8F94

BDBDB6

ECEDEE

DFE487

D2DA7D

Tritanopia

8E9393

BEB7B7

EFECEC

F49093

F28183

Achromatopsia

919191

BBBBBB

EAEAEA

C2C2C2

AEAEAE

Shades & Tints Shades & Tints

#8E9195

Dark

Light

#BEBAB4

Dark

Light

#F0E5F2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8e9195;
  --color-2: #bebab4;
  --color-3: #f0e5f2;
  --color-4: #f7b772;
  --color-5: #f79572;
}

SCSS

$color-1: #8e9195;
$color-2: #bebab4;
$color-3: #f0e5f2;
$color-4: #f7b772;
$color-5: #f79572;

TAILWIND

colors: {
  'brand-1': '#8e9195',
  'brand-2': '#bebab4',
  'brand-3': '#f0e5f2',
  'brand-4': '#f7b772',
  'brand-5': '#f79572',
}

RGB Array

[142, 145, 149], [190, 186, 180], [240, 229, 242], [247, 183, 114], [247, 149, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8E9195, #BEBAB4, #F0E5F2, #F7B772, #F79572 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: #8e9195; --color-2: #bebab4; --color-3: #f0e5f2; --color-4: #f7b772; --color-5: #f79572. 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