← Back to Editor

#FCB5B3 · #4E4037 · #FF9977 · #786459 · #F8E5BA

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

#FCB5B3

Peach Pink · LightPink · Cherry Blossom

HEX
#FCB5B3
RGB
rgb(252, 181, 179)
HSL
hsl(2, 92%, 85%)
HSB
hsb(2, 29%, 99%)
CMYK
cmyk(0%, 28%, 29%, 1%)
Oklch
oklch(83.9% 0.083 20.8)

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

#4E4037

Tangerine · DarkSlateGray · Amber Brown

HEX
#4E4037
RGB
rgb(78, 64, 55)
HSL
hsl(23, 17%, 26%)
HSB
hsb(23, 29%, 31%)
CMYK
cmyk(0%, 18%, 29%, 69%)
Oklch
oklch(38.3% 0.025 54.6)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#FF9977

Apricot · LightSalmon · Warm Sun

HEX
#FF9977
RGB
rgb(255, 153, 119)
HSL
hsl(15, 100%, 73%)
HSB
hsb(15, 53%, 100%)
CMYK
cmyk(0%, 40%, 53%, 0%)
Oklch
oklch(78.2% 0.132 39.2)

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

#786459

Tangerine · DimGray · Amber Brown

HEX
#786459
RGB
rgb(120, 100, 89)
HSL
hsl(21, 15%, 41%)
HSB
hsb(21, 26%, 47%)
CMYK
cmyk(0%, 17%, 26%, 53%)
Oklch
oklch(51.9% 0.031 50.5)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#F8E5BA

Goose Yellow · Wheat · Lemon Cream

HEX
#F8E5BA
RGB
rgb(248, 229, 186)
HSL
hsl(42, 82%, 85%)
HSB
hsb(42, 25%, 97%)
CMYK
cmyk(0%, 8%, 25%, 3%)
Oklch
oklch(92.7% 0.060 87.0)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCB5B3
B6FAFC

Analogous

FCB6D6
FCB5B3
FCDBB6

Triadic

FCB5B3
B6FCB8
B8B6FC

Split-Comp.

FCB5B3
B6FCDB
B6D6FC

Tetradic

FCB5B3
D6FCB6
B6FAFC
DBB6FC

Contrast Matrix WCAG 2.1 Contrast

FCB5B3
4E4037
FF9977
786459
F8E5BA
—
5.9
AA
1.2
Fail
3.3
AA Large
1.4
Fail
5.9
AA
—
4.8
AA
1.8
Fail
8.0
AAA
1.2
Fail
4.8
AA
—
2.7
Fail
1.7
Fail
3.3
AA Large
1.8
Fail
2.7
Fail
—
4.5
AA Large
1.4
Fail
8.0
AAA
1.7
Fail
4.5
AA Large
—
White BG
1.7Fail
9.9AAA
2.1Fail
5.6AA
1.2Fail
Black BG
12.4AAA
2.1Fail
10.1AAA
3.8AA Large
16.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDB3
484839
D3D27F
6F6F5C
F0F0C4

Deuteranopia

E1E7B4
494A3A
D9E081
71725C
F1F2C7

Tritanopia

F8B4B4
4D3B3B
FA8687
775E5E
F7CDCE

Achromatopsia

CACACA
434343
B4B4B4
696969
E6E6E6

Shades & Tints Shades & Tints

#FCB5B3

Dark
Light

#4E4037

Dark
Light

#FF9977

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcb5b3;
  --color-2: #4e4037;
  --color-3: #ff9977;
  --color-4: #786459;
  --color-5: #f8e5ba;
}

SCSS

$color-1: #fcb5b3;
$color-2: #4e4037;
$color-3: #ff9977;
$color-4: #786459;
$color-5: #f8e5ba;

TAILWIND

colors: {
  'brand-1': '#fcb5b3',
  'brand-2': '#4e4037',
  'brand-3': '#ff9977',
  'brand-4': '#786459',
  'brand-5': '#f8e5ba',
}

RGB Array

[252, 181, 179], [78, 64, 55], [255, 153, 119], [120, 100, 89], [248, 229, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCB5B3, #4E4037, #FF9977, #786459, #F8E5BA 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: #fcb5b3; --color-2: #4e4037; --color-3: #ff9977; --color-4: #786459; --color-5: #f8e5ba. 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