← Back to Editor

#F0C3B2 · #EAA8AB · #8E7F91 · #A6ADB0 · #C2B49E

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F0C3B2

Apricot · LightPink · Peach Orange

HEX
#F0C3B2
RGB
rgb(240, 195, 178)
HSL
hsl(16, 67%, 82%)
HSB
hsb(16, 26%, 94%)
CMYK
cmyk(0%, 19%, 26%, 6%)
Oklch
oklch(85.2% 0.057 41.7)

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

#EAA8AB

Peach Pink · LightPink · Coral Red

HEX
#EAA8AB
RGB
rgb(234, 168, 171)
HSL
hsl(357, 61%, 79%)
HSB
hsb(357, 28%, 92%)
CMYK
cmyk(0%, 28%, 27%, 8%)
Oklch
oklch(79.5% 0.078 16.0)

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

#8E7F91

Dark Plum · Gray · Warm Gray

HEX
#8E7F91
RGB
rgb(142, 127, 145)
HSL
hsl(290, 8%, 53%)
HSB
hsb(290, 12%, 57%)
CMYK
cmyk(2%, 12%, 0%, 43%)
Oklch
oklch(61.6% 0.032 320.6)

Traditional「Dark Plum」· Paint「Warm Gray」· Creative Urban Concrete

#A6ADB0

Ash · DarkGray · Silver Sand

HEX
#A6ADB0
RGB
rgb(166, 173, 176)
HSL
hsl(198, 6%, 67%)
HSB
hsb(198, 6%, 69%)
CMYK
cmyk(6%, 2%, 0%, 31%)
Oklch
oklch(74.3% 0.009 225.1)

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

#C2B49E

Ginger · Tan · Warm Sun

HEX
#C2B49E
RGB
rgb(194, 180, 158)
HSL
hsl(37, 23%, 69%)
HSB
hsb(37, 19%, 76%)
CMYK
cmyk(0%, 7%, 19%, 24%)
Oklch
oklch(77.6% 0.034 79.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0C3B2
B2DFF0

Analogous

F0B2C1
F0C3B2
F0E2B2

Triadic

F0C3B2
B2F0C3
C3B2F0

Split-Comp.

F0C3B2
B2F0E2
B2C1F0

Tetradic

F0C3B2
C1F0B2
B2DFF0
E2B2F0

Contrast Matrix WCAG 2.1 Contrast

F0C3B2
EAA8AB
8E7F91
A6ADB0
C2B49E
—
1.2
Fail
2.4
Fail
1.4
Fail
1.3
Fail
1.2
Fail
—
1.9
Fail
1.2
Fail
1.0
Fail
2.4
Fail
1.9
Fail
—
1.6
Fail
1.8
Fail
1.4
Fail
1.2
Fail
1.6
Fail
—
1.1
Fail
1.3
Fail
1.0
Fail
1.8
Fail
1.1
Fail
—
White BG
1.6Fail
2.0Fail
3.8AA Large
2.3Fail
2.0Fail
Black BG
13.2AAA
10.7AAA
5.6AA
9.2AAA
10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDCB6
CDCDAA
88878D
A9A9AF
BCBCA3

Deuteranopia

DFE3B7
D1D6AA
888A8C
A9A8AF
BDBEA5

Tritanopia

EEB9BA
E7AAAA
8D8988
A6AFAF
C1A8A8

Achromatopsia

CFCFCF
BCBCBC
868686
ABABAB
B6B6B6

Shades & Tints Shades & Tints

#F0C3B2

Dark
Light

#EAA8AB

Dark
Light

#8E7F91

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0c3b2;
  --color-2: #eaa8ab;
  --color-3: #8e7f91;
  --color-4: #a6adb0;
  --color-5: #c2b49e;
}

SCSS

$color-1: #f0c3b2;
$color-2: #eaa8ab;
$color-3: #8e7f91;
$color-4: #a6adb0;
$color-5: #c2b49e;

TAILWIND

colors: {
  'brand-1': '#f0c3b2',
  'brand-2': '#eaa8ab',
  'brand-3': '#8e7f91',
  'brand-4': '#a6adb0',
  'brand-5': '#c2b49e',
}

RGB Array

[240, 195, 178], [234, 168, 171], [142, 127, 145], [166, 173, 176], [194, 180, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0C3B2, #EAA8AB, #8E7F91, #A6ADB0, #C2B49E 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: #f0c3b2; --color-2: #eaa8ab; --color-3: #8e7f91; --color-4: #a6adb0; --color-5: #c2b49e. 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