← Back to Editor

#BCD5B8 · #FCF4D0 · #C46C84 · #863A5E · #702151

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#BCD5B8

Celadon · Silver · Apple Green

HEX
#BCD5B8
RGB
rgb(188, 213, 184)
HSL
hsl(112, 26%, 78%)
HSB
hsb(112, 14%, 84%)
CMYK
cmyk(12%, 0%, 14%, 16%)
Oklch
oklch(84.7% 0.048 141.3)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#FCF4D0

Goose Yellow · Beige · Lemon Cream

HEX
#FCF4D0
RGB
rgb(252, 244, 208)
HSL
hsl(49, 88%, 90%)
HSB
hsb(49, 17%, 99%)
CMYK
cmyk(0%, 3%, 17%, 1%)
Oklch
oklch(96.4% 0.048 96.8)

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

#C46C84

Dark Violet · LightCoral · Rose Pink

HEX
#C46C84
RGB
rgb(196, 108, 132)
HSL
hsl(344, 43%, 60%)
HSB
hsb(344, 45%, 77%)
CMYK
cmyk(0%, 45%, 33%, 23%)
Oklch
oklch(63.7% 0.114 3.4)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#863A5E

Dark Violet · DimGray · Camellia

HEX
#863A5E
RGB
rgb(134, 58, 94)
HSL
hsl(332, 40%, 38%)
HSB
hsb(332, 57%, 53%)
CMYK
cmyk(0%, 57%, 30%, 47%)
Oklch
oklch(46.1% 0.112 352.8)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#702151

Rose Purple · Purple · Camellia

HEX
#702151
RGB
rgb(112, 33, 81)
HSL
hsl(324, 54%, 28%)
HSB
hsb(324, 71%, 44%)
CMYK
cmyk(0%, 71%, 28%, 56%)
Oklch
oklch(38.8% 0.123 347.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BCD5B8
D2B8D5

Analogous

CBD5B8
BCD5B8
B8D5C3

Triadic

BCD5B8
B8BCD5
D5B8BC

Split-Comp.

BCD5B8
C3B8D5
D5B8CB

Tetradic

BCD5B8
B8CBD5
D2B8D5
D5C3B8

Contrast Matrix WCAG 2.1 Contrast

BCD5B8
FCF4D0
C46C84
863A5E
702151
—
1.4
Fail
2.3
Fail
4.8
AA
6.6
AA
1.4
Fail
—
3.3
AA Large
6.8
AA
9.4
AAA
2.3
Fail
3.3
AA Large
—
2.1
Fail
2.9
Fail
4.8
AA
6.8
AA
2.1
Fail
—
1.4
Fail
6.6
AA
9.4
AAA
2.9
Fail
1.4
Fail
—
White BG
1.6Fail
1.1Fail
3.6AA Large
7.6AAA
10.4AAA
Black BG
13.3AAA
19.0AAA
5.8AA
2.8Fail
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C7C7BF
F9F8D9
9E9D7E
656455
4E4D45

Deuteranopia

C5C4C1
F9FADB
A3AA7D
6A6F53
525843

Tritanopia

BDC5C6
FCE0E1
C07A79
824E4D
6C3C3A

Achromatopsia

CACACA
F2F2F2
898989
555555
3E3E3E

Shades & Tints Shades & Tints

#BCD5B8

Dark
Light

#FCF4D0

Dark
Light

#C46C84

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bcd5b8;
  --color-2: #fcf4d0;
  --color-3: #c46c84;
  --color-4: #863a5e;
  --color-5: #702151;
}

SCSS

$color-1: #bcd5b8;
$color-2: #fcf4d0;
$color-3: #c46c84;
$color-4: #863a5e;
$color-5: #702151;

TAILWIND

colors: {
  'brand-1': '#bcd5b8',
  'brand-2': '#fcf4d0',
  'brand-3': '#c46c84',
  'brand-4': '#863a5e',
  'brand-5': '#702151',
}

RGB Array

[188, 213, 184], [252, 244, 208], [196, 108, 132], [134, 58, 94], [112, 33, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BCD5B8, #FCF4D0, #C46C84, #863A5E, #702151 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: #bcd5b8; --color-2: #fcf4d0; --color-3: #c46c84; --color-4: #863a5e; --color-5: #702151. 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