← Back to Editor

#B18B7E · #F89B89 · #F8D293 · #FCEBE4 · #FFD4B3

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

#B18B7E

Tangerine · Gray · Warm Sun

HEX
#B18B7E
RGB
rgb(177, 139, 126)
HSL
hsl(15, 25%, 59%)
HSB
hsb(15, 29%, 69%)
CMYK
cmyk(0%, 21%, 29%, 31%)
Oklch
oklch(66.9% 0.050 39.7)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#F89B89

Peach Pink · LightSalmon · Coral Red

HEX
#F89B89
RGB
rgb(248, 155, 137)
HSL
hsl(10, 89%, 75%)
HSB
hsb(10, 45%, 97%)
CMYK
cmyk(0%, 38%, 45%, 3%)
Oklch
oklch(78.0% 0.115 31.6)

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

#F8D293

Goose Yellow · Khaki · Peach Orange

HEX
#F8D293
RGB
rgb(248, 210, 147)
HSL
hsl(37, 88%, 77%)
HSB
hsb(37, 41%, 97%)
CMYK
cmyk(0%, 15%, 41%, 3%)
Oklch
oklch(88.2% 0.091 79.8)

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

#FCEBE4

Apricot · Linen · Peach Orange

HEX
#FCEBE4
RGB
rgb(252, 235, 228)
HSL
hsl(17, 80%, 94%)
HSB
hsb(17, 10%, 99%)
CMYK
cmyk(0%, 7%, 10%, 1%)
Oklch
oklch(95.2% 0.021 43.9)

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

#FFD4B3

Apricot · Wheat · Peach Orange

HEX
#FFD4B3
RGB
rgb(255, 212, 179)
HSL
hsl(26, 100%, 85%)
HSB
hsb(26, 30%, 100%)
CMYK
cmyk(0%, 17%, 30%, 0%)
Oklch
oklch(89.9% 0.065 59.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B18B7E
7CA4B1

Analogous

B17C89
B18B7E
B1A47C

Triadic

B18B7E
7CB189
897CB1

Split-Comp.

B18B7E
7CB1A4
7C89B1

Tetradic

B18B7E
89B17C
7CA4B1
A47CB1

Contrast Matrix WCAG 2.1 Contrast

B18B7E
F89B89
F8D293
FCEBE4
FFD4B3
—
1.5
Fail
2.1
Fail
2.6
Fail
2.2
Fail
1.5
Fail
—
1.5
Fail
1.8
Fail
1.5
Fail
2.1
Fail
1.5
Fail
—
1.2
Fail
1.0
Fail
2.6
Fail
1.8
Fail
1.2
Fail
—
1.2
Fail
2.2
Fail
1.5
Fail
1.0
Fail
1.2
Fail
—
White BG
3.1AA Large
2.1Fail
1.4Fail
1.2Fail
1.4Fail
Black BG
6.9AA
10.0AAA
14.6AAA
18.1AAA
15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A1A081
D0CF8D
E8E7A2
F5F4E6
ECECBB

Deuteranopia

A3A682
D5DC8E
EAEDA6
F6F7E6
EFF2BD

Tritanopia

AF8484
F39192
F6AEB1
FBE7E7
FDC1C3

Achromatopsia

959595
B5B5B5
D6D6D6
EFEFEF
DDDDDD

Shades & Tints Shades & Tints

#B18B7E

Dark
Light

#F89B89

Dark
Light

#F8D293

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b18b7e;
  --color-2: #f89b89;
  --color-3: #f8d293;
  --color-4: #fcebe4;
  --color-5: #ffd4b3;
}

SCSS

$color-1: #b18b7e;
$color-2: #f89b89;
$color-3: #f8d293;
$color-4: #fcebe4;
$color-5: #ffd4b3;

TAILWIND

colors: {
  'brand-1': '#b18b7e',
  'brand-2': '#f89b89',
  'brand-3': '#f8d293',
  'brand-4': '#fcebe4',
  'brand-5': '#ffd4b3',
}

RGB Array

[177, 139, 126], [248, 155, 137], [248, 210, 147], [252, 235, 228], [255, 212, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B18B7E, #F89B89, #F8D293, #FCEBE4, #FFD4B3 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: #b18b7e; --color-2: #f89b89; --color-3: #f8d293; --color-4: #fcebe4; --color-5: #ffd4b3. 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