#8B949E + #CF939A + #F59995 + #EBBA9D + #E3CFAF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8B949E

Azure · LightSlateGray · Silver Sand

HEX

#8B949E

RGB

rgb(139, 148, 158)

HSL

hsl(212, 9%, 58%)

HSB

hsb(212, 12%, 62%)

CMYK

cmyk(12%, 6%, 0%, 38%)

Oklch

oklch(66.2% 0.018 250.9)

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

#CF939A

Peach Pink · Tan · Coral Red

HEX

#CF939A

RGB

rgb(207, 147, 154)

HSL

hsl(353, 38%, 69%)

HSB

hsb(353, 29%, 81%)

CMYK

cmyk(0%, 29%, 26%, 19%)

Oklch

oklch(72.3% 0.073 11.3)

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

#F59995

Peach Pink · LightSalmon · Coral Red

HEX

#F59995

RGB

rgb(245, 153, 149)

HSL

hsl(2, 83%, 77%)

HSB

hsb(2, 39%, 96%)

CMYK

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

Oklch

oklch(77.6% 0.111 22.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#EBBA9D

Apricot · BurlyWood · Peach Orange

HEX

#EBBA9D

RGB

rgb(235, 186, 157)

HSL

hsl(22, 66%, 77%)

HSB

hsb(22, 33%, 92%)

CMYK

cmyk(0%, 21%, 33%, 8%)

Oklch

oklch(82.6% 0.069 52.1)

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

#E3CFAF

Goose Yellow · Wheat · Peach Orange

HEX

#E3CFAF

RGB

rgb(227, 207, 175)

HSL

hsl(37, 48%, 79%)

HSB

hsb(37, 23%, 89%)

CMYK

cmyk(0%, 9%, 23%, 11%)

Oklch

oklch(86.3% 0.048 79.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8B949E

9E958A

Analogous

8A9D9E

8B949E

8B8A9E

Triadic

8B949E

9E8A93

939E8A

Split-Comp.

8B949E

9E8B8A

9D9E8A

Tetradic

8B949E

9E8A9D

9E958A

8A9E8B

Contrast Matrix WCAG 2.1 Contrast

8B949E	CF939A	F59995	EBBA9D	E3CFAF
—	1.2 Fail	1.4 Fail	1.8 Fail	2.0 Fail
1.2 Fail	—	1.2 Fail	1.5 Fail	1.7 Fail
1.4 Fail	1.2 Fail	—	1.2 Fail	1.4 Fail
1.8 Fail	1.5 Fail	1.2 Fail	—	1.1 Fail
2.0 Fail	1.7 Fail	1.4 Fail	1.1 Fail	—

White BG

3.1AA Large

2.5Fail

2.1Fail

1.7Fail

1.5Fail

Black BG

6.8AA

8.3AAA

9.9AAA

12.0AAA

13.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8F9C

B5B498

CDCC96

D6D5A4

DADAB7

Deuteranopia

8E8E9B

B9BD98

D3D996

D9DCA6

DCDDB9

Tritanopia

8B9A99

CC9797

F09797

E9AAAB

E2BDBE

Achromatopsia

929292

A6A6A6

B4B4B4

C5C5C5

D1D1D1

Shades & Tints Shades & Tints

#8B949E

Dark

Light

#CF939A

Dark

Light

#F59995

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8b949e;
  --color-2: #cf939a;
  --color-3: #f59995;
  --color-4: #ebba9d;
  --color-5: #e3cfaf;
}

SCSS

$color-1: #8b949e;
$color-2: #cf939a;
$color-3: #f59995;
$color-4: #ebba9d;
$color-5: #e3cfaf;

TAILWIND

colors: {
  'brand-1': '#8b949e',
  'brand-2': '#cf939a',
  'brand-3': '#f59995',
  'brand-4': '#ebba9d',
  'brand-5': '#e3cfaf',
}

RGB Array

[139, 148, 158], [207, 147, 154], [245, 153, 149], [235, 186, 157], [227, 207, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8B949E, #CF939A, #F59995, #EBBA9D, #E3CFAF 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: #8b949e; --color-2: #cf939a; --color-3: #f59995; --color-4: #ebba9d; --color-5: #e3cfaf. 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