#F0FACD + #E0DBBC + #D1B7AC + #C09C99 + #B07D86 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F0FACD

Willow Green · Beige · Mint Green

HEX

#F0FACD

RGB

rgb(240, 250, 205)

HSL

hsl(73, 82%, 89%)

HSB

hsb(73, 18%, 98%)

CMYK

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

Oklch

oklch(96.6% 0.059 117.7)

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

#E0DBBC

Fresh Green · Wheat · Lemon Cream

HEX

#E0DBBC

RGB

rgb(224, 219, 188)

HSL

hsl(52, 37%, 81%)

HSB

hsb(52, 16%, 88%)

CMYK

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

Oklch

oklch(88.7% 0.042 99.6)

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

#D1B7AC

Apricot · Silver · Warm Sun

HEX

#D1B7AC

RGB

rgb(209, 183, 172)

HSL

hsl(18, 29%, 75%)

HSB

hsb(18, 18%, 82%)

CMYK

cmyk(0%, 12%, 18%, 18%)

Oklch

oklch(79.9% 0.034 44.3)

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

#C09C99

Peach Pink · DarkGray · Coral Red

HEX

#C09C99

RGB

rgb(192, 156, 153)

HSL

hsl(5, 24%, 68%)

HSB

hsb(5, 20%, 75%)

CMYK

cmyk(0%, 19%, 20%, 25%)

Oklch

oklch(72.5% 0.043 23.8)

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

#B07D86

Crimson · Gray · Passion Red

HEX

#B07D86

RGB

rgb(176, 125, 134)

HSL

hsl(349, 24%, 59%)

HSB

hsb(349, 29%, 69%)

CMYK

cmyk(0%, 29%, 24%, 31%)

Oklch

oklch(64.3% 0.064 7.4)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0FACD

D6CCFA

Analogous

FAEDCC

F0FACD

D9FACC

Triadic

F0FACD

CCF0FA

FACCF0

Split-Comp.

F0FACD

CCD9FA

EDCCFA

Tetradic

F0FACD

CCFAED

D6CCFA

FACCD9

Contrast Matrix WCAG 2.1 Contrast

F0FACD	E0DBBC	D1B7AC	C09C99	B07D86
—	1.3 Fail	1.7 Fail	2.3 Fail	3.1 AA Large
1.3 Fail	—	1.4 Fail	1.8 Fail	2.5 Fail
1.7 Fail	1.4 Fail	—	1.3 Fail	1.8 Fail
2.3 Fail	1.8 Fail	1.3 Fail	—	1.4 Fail
3.1 AA Large	2.5 Fail	1.8 Fail	1.4 Fail	—

White BG

1.1Fail

1.4Fail

1.9Fail

2.5Fail

3.4AA Large

Black BG

19.3AAA

15.0AAA

11.1AAA

8.5AAA

6.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F4F4D8

DEDEC4

C6C6AF

B0B09A

9A9984

Deuteranopia

F4F3DB

DEDFC5

C7C9AF

B3B59A

9DA183

Tritanopia

F1E0E2

E0C9CB

D0B1B1

BE9A9A

AD8282

Achromatopsia

F2F2F2

D9D9D9

BEBEBE

A6A6A6

8D8D8D

Shades & Tints Shades & Tints

#F0FACD

Dark

Light

#E0DBBC

Dark

Light

#D1B7AC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0facd;
  --color-2: #e0dbbc;
  --color-3: #d1b7ac;
  --color-4: #c09c99;
  --color-5: #b07d86;
}

SCSS

$color-1: #f0facd;
$color-2: #e0dbbc;
$color-3: #d1b7ac;
$color-4: #c09c99;
$color-5: #b07d86;

TAILWIND

colors: {
  'brand-1': '#f0facd',
  'brand-2': '#e0dbbc',
  'brand-3': '#d1b7ac',
  'brand-4': '#c09c99',
  'brand-5': '#b07d86',
}

RGB Array

[240, 250, 205], [224, 219, 188], [209, 183, 172], [192, 156, 153], [176, 125, 134]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0FACD, #E0DBBC, #D1B7AC, #C09C99, #B07D86 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: #f0facd; --color-2: #e0dbbc; --color-3: #d1b7ac; --color-4: #c09c99; --color-5: #b07d86. 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