#F4EFEF + #CBD89B + #9CB1B6 + #BEA1B7 + #F092A6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F4EFEF

Peach Pink · Linen · Cherry Blossom

HEX

#F4EFEF

RGB

rgb(244, 239, 239)

HSL

hsl(0, 19%, 95%)

HSB

hsb(0, 2%, 96%)

CMYK

cmyk(0%, 2%, 2%, 4%)

Oklch

oklch(95.6% 0.005 17.3)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#CBD89B

Willow Green · Tan · Apple Green

HEX

#CBD89B

RGB

rgb(203, 216, 155)

HSL

hsl(73, 44%, 73%)

HSB

hsb(73, 28%, 85%)

CMYK

cmyk(6%, 0%, 28%, 15%)

Oklch

oklch(85.7% 0.082 117.9)

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

#9CB1B6

Sky Blue · DarkGray · Lake Green

HEX

#9CB1B6

RGB

rgb(156, 177, 182)

HSL

hsl(192, 15%, 66%)

HSB

hsb(192, 14%, 71%)

CMYK

cmyk(14%, 3%, 0%, 29%)

Oklch

oklch(74.6% 0.024 213.7)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#BEA1B7

Mauve · DarkGray · Lilac Purple

HEX

#BEA1B7

RGB

rgb(190, 161, 183)

HSL

hsl(314, 18%, 69%)

HSB

hsb(314, 15%, 75%)

CMYK

cmyk(0%, 15%, 4%, 25%)

Oklch

oklch(74.1% 0.045 334.5)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#F092A6

Peach Pink · LightCoral · Coral Red

HEX

#F092A6

RGB

rgb(240, 146, 166)

HSL

hsl(347, 76%, 76%)

HSB

hsb(347, 39%, 94%)

CMYK

cmyk(0%, 39%, 31%, 6%)

Oklch

oklch(76.3% 0.115 6.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4EFEF

F0F5F5

Analogous

F5F0F2

F4EFEF

F5F2F0

Triadic

F4EFEF

F0F5F0

F0F0F5

Split-Comp.

F4EFEF

F0F5F2

F0F2F5

Tetradic

F4EFEF

F2F5F0

F0F5F5

F2F0F5

Contrast Matrix WCAG 2.1 Contrast

F4EFEF	CBD89B	9CB1B6	BEA1B7	F092A6
—	1.3 Fail	2.0 Fail	2.1 Fail	2.0 Fail
1.3 Fail	—	1.5 Fail	1.5 Fail	1.5 Fail
2.0 Fail	1.5 Fail	—	1.0 Fail	1.0 Fail
2.1 Fail	1.5 Fail	1.0 Fail	—	1.0 Fail
2.0 Fail	1.5 Fail	1.0 Fail	1.0 Fail	—

White BG

1.1Fail

1.5Fail

2.2Fail

2.3Fail

2.2Fail

Black BG

18.4AAA

13.8AAA

9.4AAA

9.0AAA

9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F2F2EF

D1D1AA

A5A5B5

B1B1B2

C7C6A1

Deuteranopia

F2F3EF

D0CFAD

A4A2B5

B3B5B0

CDD4A0

Tritanopia

F4EFEF

CCB5B8

9DB4B4

BDADAD

EB9D9D

Achromatopsia

F0F0F0

CDCDCD

ABABAB

ACACAC

B0B0B0

Shades & Tints Shades & Tints

#F4EFEF

Dark

Light

#CBD89B

Dark

Light

#9CB1B6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4efef;
  --color-2: #cbd89b;
  --color-3: #9cb1b6;
  --color-4: #bea1b7;
  --color-5: #f092a6;
}

SCSS

$color-1: #f4efef;
$color-2: #cbd89b;
$color-3: #9cb1b6;
$color-4: #bea1b7;
$color-5: #f092a6;

TAILWIND

colors: {
  'brand-1': '#f4efef',
  'brand-2': '#cbd89b',
  'brand-3': '#9cb1b6',
  'brand-4': '#bea1b7',
  'brand-5': '#f092a6',
}

RGB Array

[244, 239, 239], [203, 216, 155], [156, 177, 182], [190, 161, 183], [240, 146, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F4EFEF, #CBD89B, #9CB1B6, #BEA1B7, #F092A6 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: #f4efef; --color-2: #cbd89b; --color-3: #9cb1b6; --color-4: #bea1b7; --color-5: #f092a6. 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