← Back to Editor

#F76798 · #F89FA1 · #F4C6A4 · #FDDFD4 · #C7D4A6

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#F76798

Rouge · LightCoral · Rose Pink

HEX
#F76798
RGB
rgb(247, 103, 152)
HSL
hsl(340, 90%, 69%)
HSB
hsb(340, 58%, 97%)
CMYK
cmyk(0%, 58%, 38%, 3%)
Oklch
oklch(70.6% 0.182 1.7)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#F89FA1

Peach Pink · LightSalmon · Coral Red

HEX
#F89FA1
RGB
rgb(248, 159, 161)
HSL
hsl(359, 86%, 80%)
HSB
hsb(359, 36%, 97%)
CMYK
cmyk(0%, 36%, 35%, 3%)
Oklch
oklch(79.2% 0.106 18.3)

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

#F4C6A4

Apricot · Wheat · Peach Orange

HEX
#F4C6A4
RGB
rgb(244, 198, 164)
HSL
hsl(25, 78%, 80%)
HSB
hsb(25, 33%, 96%)
CMYK
cmyk(0%, 19%, 33%, 4%)
Oklch
oklch(85.8% 0.069 58.1)

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

#FDDFD4

Apricot · Bisque · Peach Orange

HEX
#FDDFD4
RGB
rgb(253, 223, 212)
HSL
hsl(16, 91%, 91%)
HSB
hsb(16, 16%, 99%)
CMYK
cmyk(0%, 12%, 16%, 1%)
Oklch
oklch(92.5% 0.037 41.2)

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

#C7D4A6

Willow Green · Silver · Apple Green

HEX
#C7D4A6
RGB
rgb(199, 212, 166)
HSL
hsl(77, 35%, 74%)
HSB
hsb(77, 22%, 83%)
CMYK
cmyk(6%, 0%, 22%, 17%)
Oklch
oklch(84.8% 0.063 120.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F76798
69F7C8

Analogous

F769DF
F76798
F78169

Triadic

F76798
98F769
6998F7

Split-Comp.

F76798
69F781
69DFF7

Tetradic

F76798
DFF769
69F7C8
8169F7

Contrast Matrix WCAG 2.1 Contrast

F76798
F89FA1
F4C6A4
FDDFD4
C7D4A6
—
1.4
Fail
1.8
Fail
2.3
Fail
1.8
Fail
1.4
Fail
—
1.3
Fail
1.6
Fail
1.3
Fail
1.8
Fail
1.3
Fail
—
1.2
Fail
1.0
Fail
2.3
Fail
1.6
Fail
1.2
Fail
—
1.2
Fail
1.8
Fail
1.3
Fail
1.0
Fail
1.2
Fail
—
White BG
2.9Fail
2.0Fail
1.6Fail
1.3Fail
1.6Fail
Black BG
7.3AAA
10.5AAA
13.5AAA
16.7AAA
13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B78C
D1D1A1
E0E0AC
F0F0D7
CDCDB1

Deuteranopia

C1CC89
D7DDA0
E3E6AE
F2F4D7
CCCBB4

Tritanopia

F08381
F4A0A0
F2B3B4
FCD9D9
C8BABC

Achromatopsia

989898
BABABA
D0D0D0
E7E7E7
CBCBCB

Shades & Tints Shades & Tints

#F76798

Dark
Light

#F89FA1

Dark
Light

#F4C6A4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f76798;
  --color-2: #f89fa1;
  --color-3: #f4c6a4;
  --color-4: #fddfd4;
  --color-5: #c7d4a6;
}

SCSS

$color-1: #f76798;
$color-2: #f89fa1;
$color-3: #f4c6a4;
$color-4: #fddfd4;
$color-5: #c7d4a6;

TAILWIND

colors: {
  'brand-1': '#f76798',
  'brand-2': '#f89fa1',
  'brand-3': '#f4c6a4',
  'brand-4': '#fddfd4',
  'brand-5': '#c7d4a6',
}

RGB Array

[247, 103, 152], [248, 159, 161], [244, 198, 164], [253, 223, 212], [199, 212, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F76798, #F89FA1, #F4C6A4, #FDDFD4, #C7D4A6 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f76798; --color-2: #f89fa1; --color-3: #f4c6a4; --color-4: #fddfd4; --color-5: #c7d4a6. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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