← Back to Editor

#F4DBC5 · #D9C9CA · #DB8179 · #87647C · #251438

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

#F4DBC5

Apricot · Bisque · Peach Orange

HEX
#F4DBC5
RGB
rgb(244, 219, 197)
HSL
hsl(28, 68%, 86%)
HSB
hsb(28, 19%, 96%)
CMYK
cmyk(0%, 10%, 19%, 4%)
Oklch
oklch(90.6% 0.040 63.7)

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

#D9C9CA

Peach Pink · LightGray · Cherry Blossom

HEX
#D9C9CA
RGB
rgb(217, 201, 202)
HSL
hsl(356, 17%, 82%)
HSB
hsb(356, 7%, 85%)
CMYK
cmyk(0%, 7%, 7%, 15%)
Oklch
oklch(84.9% 0.018 13.2)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#DB8179

Peach Pink · LightCoral · Coral Red

HEX
#DB8179
RGB
rgb(219, 129, 121)
HSL
hsl(5, 58%, 67%)
HSB
hsb(5, 45%, 86%)
CMYK
cmyk(0%, 41%, 45%, 14%)
Oklch
oklch(69.8% 0.113 25.8)

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

#87647C

Rose Purple · Gray · Violet

HEX
#87647C
RGB
rgb(135, 100, 124)
HSL
hsl(319, 15%, 46%)
HSB
hsb(319, 26%, 53%)
CMYK
cmyk(0%, 26%, 8%, 47%)
Oklch
oklch(54.7% 0.057 338.4)

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

#251438

Deep Indigo · MidnightBlue · Dark Purple

HEX
#251438
RGB
rgb(37, 20, 56)
HSL
hsl(268, 47%, 15%)
HSB
hsb(268, 64%, 22%)
CMYK
cmyk(34%, 64%, 0%, 78%)
Oklch
oklch(23.5% 0.068 303.3)

Traditional「Deep Indigo」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4DBC5
C3DDF4

Analogous

F4C3C5
F4DBC5
F4F2C3

Triadic

F4DBC5
C3F4DA
DAC3F4

Split-Comp.

F4DBC5
C3F4F2
C3C5F4

Tetradic

F4DBC5
C5F4C3
C3DDF4
F2C3F4

Contrast Matrix WCAG 2.1 Contrast

F4DBC5
D9C9CA
DB8179
87647C
251438
—
1.2
Fail
2.1
Fail
3.8
AA Large
12.8
AAA
1.2
Fail
—
1.8
Fail
3.2
AA Large
10.6
AAA
2.1
Fail
1.8
Fail
—
1.8
Fail
6.0
AA
3.8
AA Large
3.2
AA Large
1.8
Fail
—
3.4
AA Large
12.8
AAA
10.6
AAA
6.0
AA
3.4
AA Large
—
White BG
1.3Fail
1.6Fail
2.8Fail
5.1AA
17.0AAA
Black BG
15.8AAA
13.2AAA
7.4AAA
4.1AA Large
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9CA
D2D2CA
B4B37B
787876
1E1D2F

Deuteranopia

EBEDCC
D3D4CA
B9C07B
7A7D75
1F202D

Tritanopia

F3CFCF
D8CACA
D67C7D
857271
242827

Achromatopsia

E0E0E0
CECECE
9B9B9B
717171
1D1D1D

Shades & Tints Shades & Tints

#F4DBC5

Dark
Light

#D9C9CA

Dark
Light

#DB8179

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4dbc5;
  --color-2: #d9c9ca;
  --color-3: #db8179;
  --color-4: #87647c;
  --color-5: #251438;
}

SCSS

$color-1: #f4dbc5;
$color-2: #d9c9ca;
$color-3: #db8179;
$color-4: #87647c;
$color-5: #251438;

TAILWIND

colors: {
  'brand-1': '#f4dbc5',
  'brand-2': '#d9c9ca',
  'brand-3': '#db8179',
  'brand-4': '#87647c',
  'brand-5': '#251438',
}

RGB Array

[244, 219, 197], [217, 201, 202], [219, 129, 121], [135, 100, 124], [37, 20, 56]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F4DBC5, #D9C9CA, #DB8179, #87647C, #251438 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: #f4dbc5; --color-2: #d9c9ca; --color-3: #db8179; --color-4: #87647c; --color-5: #251438. 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