#F5CFBC + #D1C5B8 + #ADCCC0 + #A4E0D7 + #99F2D4 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F5CFBC

Apricot · Wheat · Peach Orange

HEX

#F5CFBC

RGB

rgb(245, 207, 188)

HSL

hsl(20, 74%, 85%)

HSB

hsb(20, 23%, 96%)

CMYK

cmyk(0%, 16%, 23%, 4%)

Oklch

oklch(88.2% 0.050 48.1)

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

#D1C5B8

Goose Yellow · Silver · Peach Orange

HEX

#D1C5B8

RGB

rgb(209, 197, 184)

HSL

hsl(31, 21%, 77%)

HSB

hsb(31, 12%, 82%)

CMYK

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

Oklch

oklch(83.0% 0.022 69.7)

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

#ADCCC0

Jade · Silver · Apple Green

HEX

#ADCCC0

RGB

rgb(173, 204, 192)

HSL

hsl(157, 23%, 74%)

HSB

hsb(157, 15%, 80%)

CMYK

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

Oklch

oklch(81.9% 0.037 170.0)

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

#A4E0D7

Jade · LightBlue · Glacier Blue

HEX

#A4E0D7

RGB

rgb(164, 224, 215)

HSL

hsl(171, 49%, 76%)

HSB

hsb(171, 27%, 88%)

CMYK

cmyk(27%, 0%, 4%, 12%)

Oklch

oklch(86.3% 0.062 184.6)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#99F2D4

Jade · LightBlue · Glacier Blue

HEX

#99F2D4

RGB

rgb(153, 242, 212)

HSL

hsl(160, 77%, 77%)

HSB

hsb(160, 37%, 95%)

CMYK

cmyk(37%, 0%, 12%, 5%)

Oklch

oklch(89.7% 0.096 170.7)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5CFBC

BCE2F5

Analogous

F5BCC6

F5CFBC

F5ECBC

Triadic

F5CFBC

BCF5CF

CFBCF5

Split-Comp.

F5CFBC

BCF5EC

BCC6F5

Tetradic

F5CFBC

C6F5BC

BCE2F5

ECBCF5

Contrast Matrix WCAG 2.1 Contrast

F5CFBC	D1C5B8	ADCCC0	A4E0D7	99F2D4
—	1.2 Fail	1.2 Fail	1.0 Fail	1.1 Fail
1.2 Fail	—	1.0 Fail	1.1 Fail	1.3 Fail
1.2 Fail	1.0 Fail	—	1.2 Fail	1.3 Fail
1.0 Fail	1.1 Fail	1.2 Fail	—	1.1 Fail
1.1 Fail	1.3 Fail	1.3 Fail	1.1 Fail	—

White BG

1.4Fail

1.7Fail

1.5Fail

1.3Fail

Black BG

14.5AAA

12.4AAA

12.2AAA

14.2AAA

16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E4C1

CCCCBB

BABBC3

BEBFD9

C0C0DB

Deuteranopia

E7EAC2

CDCDBC

B9B6C4

BBB6DA

BAB4DD

Tritanopia

F3C4C5

D0BEBE

AFC5C6

A7DBDB

9DE1E2

Achromatopsia

D8D8D8

C7C7C7

C1C1C1

CDCDCD

D4D4D4

Shades & Tints Shades & Tints

#F5CFBC

Dark

Light

#D1C5B8

Dark

Light

#ADCCC0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5cfbc;
  --color-2: #d1c5b8;
  --color-3: #adccc0;
  --color-4: #a4e0d7;
  --color-5: #99f2d4;
}

SCSS

$color-1: #f5cfbc;
$color-2: #d1c5b8;
$color-3: #adccc0;
$color-4: #a4e0d7;
$color-5: #99f2d4;

TAILWIND

colors: {
  'brand-1': '#f5cfbc',
  'brand-2': '#d1c5b8',
  'brand-3': '#adccc0',
  'brand-4': '#a4e0d7',
  'brand-5': '#99f2d4',
}

RGB Array

[245, 207, 188], [209, 197, 184], [173, 204, 192], [164, 224, 215], [153, 242, 212]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F5CFBC, #D1C5B8, #ADCCC0, #A4E0D7, #99F2D4 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: #f5cfbc; --color-2: #d1c5b8; --color-3: #adccc0; --color-4: #a4e0d7; --color-5: #99f2d4. 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