← Back to Editor

#FCCFC4 · #F7AC99 · #6ABAA2 · #8A7885 · #734166

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#FCCFC4

Peach Pink · Pink · Cherry Blossom

HEX
#FCCFC4
RGB
rgb(252, 207, 196)
HSL
hsl(12, 90%, 88%)
HSB
hsb(12, 22%, 99%)
CMYK
cmyk(0%, 18%, 22%, 1%)
Oklch
oklch(89.0% 0.053 34.0)

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

#F7AC99

Peach Pink · BurlyWood · Coral Red

HEX
#F7AC99
RGB
rgb(247, 172, 153)
HSL
hsl(12, 85%, 78%)
HSB
hsb(12, 38%, 97%)
CMYK
cmyk(0%, 30%, 38%, 3%)
Oklch
oklch(81.2% 0.093 34.8)

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

#6ABAA2

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#6ABAA2
RGB
rgb(106, 186, 162)
HSL
hsl(162, 37%, 57%)
HSB
hsb(162, 43%, 73%)
CMYK
cmyk(43%, 0%, 13%, 27%)
Oklch
oklch(73.1% 0.087 172.4)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#8A7885

Ash · Gray · Warm Gray

HEX
#8A7885
RGB
rgb(138, 120, 133)
HSL
hsl(317, 7%, 51%)
HSB
hsb(317, 13%, 54%)
CMYK
cmyk(0%, 13%, 4%, 46%)
Oklch
oklch(59.3% 0.029 335.8)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#734166

Rose Purple · DimGray · Eggplant

HEX
#734166
RGB
rgb(115, 65, 102)
HSL
hsl(316, 28%, 35%)
HSB
hsb(316, 43%, 45%)
CMYK
cmyk(0%, 43%, 11%, 55%)
Oklch
oklch(44.9% 0.086 337.3)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCCFC4
C5F1FC

Analogous

FCC5D5
FCCFC4
FCEBC5

Triadic

FCCFC4
C5FCD0
D0C5FC

Split-Comp.

FCCFC4
C5FCEB
C5D5FC

Tetradic

FCCFC4
D5FCC5
C5F1FC
EBC5FC

Contrast Matrix WCAG 2.1 Contrast

FCCFC4
F7AC99
6ABAA2
8A7885
734166
—
1.3
Fail
1.6
Fail
2.9
Fail
5.6
AA
1.3
Fail
—
1.2
Fail
2.2
Fail
4.2
AA Large
1.6
Fail
1.2
Fail
—
1.8
Fail
3.4
AA Large
2.9
Fail
2.2
Fail
1.8
Fail
—
1.9
Fail
5.6
AA
4.2
AA Large
3.4
AA Large
1.9
Fail
—
White BG
1.4Fail
1.9Fail
2.3Fail
4.1AA Large
7.8AAA
Black BG
14.9AAA
11.3AAA
9.2AAA
5.1AA
2.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E8C7
D7D69E
8D8DA8
828282
5D5D5D

Deuteranopia

EBEEC7
DBE09F
8882A9
838581
60645B

Tritanopia

FAC9C9
F3A1A2
6EACAD
897F7F
715654

Achromatopsia

DBDBDB
C0C0C0
9F9F9F
7F7F7F
545454

Shades & Tints Shades & Tints

#FCCFC4

Dark
Light

#F7AC99

Dark
Light

#6ABAA2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fccfc4;
  --color-2: #f7ac99;
  --color-3: #6abaa2;
  --color-4: #8a7885;
  --color-5: #734166;
}

SCSS

$color-1: #fccfc4;
$color-2: #f7ac99;
$color-3: #6abaa2;
$color-4: #8a7885;
$color-5: #734166;

TAILWIND

colors: {
  'brand-1': '#fccfc4',
  'brand-2': '#f7ac99',
  'brand-3': '#6abaa2',
  'brand-4': '#8a7885',
  'brand-5': '#734166',
}

RGB Array

[252, 207, 196], [247, 172, 153], [106, 186, 162], [138, 120, 133], [115, 65, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCCFC4, #F7AC99, #6ABAA2, #8A7885, #734166 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #fccfc4; --color-2: #f7ac99; --color-3: #6abaa2; --color-4: #8a7885; --color-5: #734166. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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