← Back to Editor

#FFCBBD · #F2A99A · #CF968D · #F17944 · #322326

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

#FFCBBD

Peach Pink · Pink · Cherry Blossom

HEX
#FFCBBD
RGB
rgb(255, 203, 189)
HSL
hsl(13, 100%, 87%)
HSB
hsb(13, 26%, 100%)
CMYK
cmyk(0%, 20%, 26%, 0%)
Oklch
oklch(88.4% 0.063 35.5)

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

#F2A99A

Peach Pink · BurlyWood · Coral Red

HEX
#F2A99A
RGB
rgb(242, 169, 154)
HSL
hsl(10, 77%, 78%)
HSB
hsb(10, 36%, 95%)
CMYK
cmyk(0%, 30%, 36%, 5%)
Oklch
oklch(80.1% 0.089 32.0)

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

#CF968D

Peach Pink · Tan · Coral Red

HEX
#CF968D
RGB
rgb(207, 150, 141)
HSL
hsl(8, 41%, 68%)
HSB
hsb(8, 32%, 81%)
CMYK
cmyk(0%, 28%, 32%, 19%)
Oklch
oklch(72.6% 0.071 29.0)

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

#F17944

Apricot · Coral · Warm Sun

HEX
#F17944
RGB
rgb(241, 121, 68)
HSL
hsl(18, 86%, 61%)
HSB
hsb(18, 72%, 95%)
CMYK
cmyk(0%, 50%, 72%, 5%)
Oklch
oklch(70.6% 0.162 43.1)

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

#322326

Crimson · DarkSlateGray · Deep Berry

HEX
#322326
RGB
rgb(50, 35, 38)
HSL
hsl(348, 18%, 17%)
HSB
hsb(348, 30%, 20%)
CMYK
cmyk(0%, 30%, 24%, 80%)
Oklch
oklch(27.5% 0.023 5.4)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFCBBD
BDF1FF

Analogous

FFBDCF
FFCBBD
FFECBD

Triadic

FFCBBD
BDFFCB
CBBDFF

Split-Comp.

FFCBBD
BDFFEC
BDCFFF

Tetradic

FFCBBD
CFFFBD
BDF1FF
ECBDFF

Contrast Matrix WCAG 2.1 Contrast

FFCBBD
F2A99A
CF968D
F17944
322326
—
1.3
Fail
1.7
Fail
1.9
Fail
10.3
AAA
1.3
Fail
—
1.3
Fail
1.4
Fail
7.8
AAA
1.7
Fail
1.3
Fail
—
1.1
Fail
6.0
AA
1.9
Fail
1.4
Fail
1.1
Fail
—
5.4
AA
10.3
AAA
7.8
AAA
6.0
AA
5.4
AA
—
White BG
1.4Fail
1.9Fail
2.5Fail
2.8Fail
15.0AAA
Black BG
14.5AAA
10.9AAA
8.4AAA
7.6AAA
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E8C0
D2D29E
B6B68F
BDBC51
2C2B25

Deuteranopia

ECEFC1
D7DC9F
BABE90
C4CD54
2C2E25

Tritanopia

FCC3C4
EEA0A1
CC9191
EB5B5D
312525

Achromatopsia

D9D9D9
BDBDBD
A6A6A6
979797
282828

Shades & Tints Shades & Tints

#FFCBBD

Dark
Light

#F2A99A

Dark
Light

#CF968D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffcbbd;
  --color-2: #f2a99a;
  --color-3: #cf968d;
  --color-4: #f17944;
  --color-5: #322326;
}

SCSS

$color-1: #ffcbbd;
$color-2: #f2a99a;
$color-3: #cf968d;
$color-4: #f17944;
$color-5: #322326;

TAILWIND

colors: {
  'brand-1': '#ffcbbd',
  'brand-2': '#f2a99a',
  'brand-3': '#cf968d',
  'brand-4': '#f17944',
  'brand-5': '#322326',
}

RGB Array

[255, 203, 189], [242, 169, 154], [207, 150, 141], [241, 121, 68], [50, 35, 38]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFCBBD, #F2A99A, #CF968D, #F17944, #322326 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #ffcbbd; --color-2: #f2a99a; --color-3: #cf968d; --color-4: #f17944; --color-5: #322326. 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 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