← Back to Editor

#D17386 · #FFFCBF · #E1EB9B · #4D4D4D · #FCCB9A

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 AppData Visualization

Color Details Color Details

#D17386

Peach Pink · LightCoral · Coral Red

HEX
#D17386
RGB
rgb(209, 115, 134)
HSL
hsl(348, 51%, 64%)
HSB
hsb(348, 45%, 82%)
CMYK
cmyk(0%, 45%, 36%, 18%)
Oklch
oklch(66.6% 0.119 7.9)

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

#FFFCBF

Fresh Green · Bisque · Lemon Cream

HEX
#FFFCBF
RGB
rgb(255, 252, 191)
HSL
hsl(57, 100%, 87%)
HSB
hsb(57, 25%, 100%)
CMYK
cmyk(0%, 1%, 25%, 0%)
Oklch
oklch(97.9% 0.078 105.4)

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

#E1EB9B

Fresh Green · Khaki · Lemon Cream

HEX
#E1EB9B
RGB
rgb(225, 235, 155)
HSL
hsl(68, 67%, 76%)
HSB
hsb(68, 34%, 92%)
CMYK
cmyk(4%, 0%, 34%, 8%)
Oklch
oklch(91.4% 0.102 114.3)

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

#4D4D4D

Dark Cyan · DarkSlateGray · Charcoal

HEX
#4D4D4D
RGB
rgb(77, 77, 77)
HSL
hsl(0, 0%, 30%)
HSB
hsb(0, 0%, 30%)
CMYK
cmyk(0%, 0%, 0%, 70%)
Oklch
oklch(42.0% 0.000 89.9)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

#FCCB9A

Goose Yellow · Wheat · Peach Orange

HEX
#FCCB9A
RGB
rgb(252, 203, 154)
HSL
hsl(30, 94%, 80%)
HSB
hsb(30, 39%, 99%)
CMYK
cmyk(0%, 19%, 39%, 1%)
Oklch
oklch(87.4% 0.084 66.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D17386
74D2BF

Analogous

D274B6
D17386
D29074

Triadic

D17386
87D274
7487D2

Split-Comp.

D17386
74D290
74B6D2

Tetradic

D17386
B6D274
74D2BF
9074D2

Contrast Matrix WCAG 2.1 Contrast

D17386
FFFCBF
E1EB9B
4D4D4D
FCCB9A
—
3.1
AA Large
2.5
Fail
2.6
Fail
2.2
Fail
3.1
AA Large
—
1.2
Fail
8.0
AAA
1.4
Fail
2.5
Fail
1.2
Fail
—
6.7
AA
1.2
Fail
2.6
Fail
8.0
AAA
6.7
AA
—
5.7
AA
2.2
Fail
1.4
Fail
1.2
Fail
5.7
AA
—
White BG
3.2AA Large
1.1Fail
1.3Fail
8.5AAA
1.5Fail
Black BG
6.5AA
19.9AAA
16.6AAA
2.5Fail
14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A8A781
FEFECE
E5E5AE
4D4D4D
E7E6A6

Deuteranopia

AEB580
FEFED1
E5E4B3
4D4D4D
EAEDA9

Tritanopia

CC7E7D
FFD9DC
E2BEC1
4D4D4D
FAAFB1

Achromatopsia

919191
F6F6F6
DFDFDF
4D4D4D
D4D4D4

Shades & Tints Shades & Tints

#D17386

Dark
Light

#FFFCBF

Dark
Light

#E1EB9B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d17386;
  --color-2: #fffcbf;
  --color-3: #e1eb9b;
  --color-4: #4d4d4d;
  --color-5: #fccb9a;
}

SCSS

$color-1: #d17386;
$color-2: #fffcbf;
$color-3: #e1eb9b;
$color-4: #4d4d4d;
$color-5: #fccb9a;

TAILWIND

colors: {
  'brand-1': '#d17386',
  'brand-2': '#fffcbf',
  'brand-3': '#e1eb9b',
  'brand-4': '#4d4d4d',
  'brand-5': '#fccb9a',
}

RGB Array

[209, 115, 134], [255, 252, 191], [225, 235, 155], [77, 77, 77], [252, 203, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D17386, #FFFCBF, #E1EB9B, #4D4D4D, #FCCB9A is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #d17386; --color-2: #fffcbf; --color-3: #e1eb9b; --color-4: #4d4d4d; --color-5: #fccb9a. 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. 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 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