← Back to Editor

#D9BFA3 · #AABFB5 · #B09D9B · #BC7487 · #C4186B

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 Library

Color Details Color Details

#D9BFA3

Goose Yellow · Tan · Warm Sun

HEX
#D9BFA3
RGB
rgb(217, 191, 163)
HSL
hsl(31, 42%, 75%)
HSB
hsb(31, 25%, 85%)
CMYK
cmyk(0%, 12%, 25%, 15%)
Oklch
oklch(82.0% 0.048 69.2)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#AABFB5

Jade · Silver · Apple Green

HEX
#AABFB5
RGB
rgb(170, 191, 181)
HSL
hsl(151, 14%, 71%)
HSB
hsb(151, 11%, 75%)
CMYK
cmyk(11%, 0%, 5%, 25%)
Oklch
oklch(78.6% 0.027 165.4)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#B09D9B

Peach Pink · DarkGray · Coral Red

HEX
#B09D9B
RGB
rgb(176, 157, 155)
HSL
hsl(6, 12%, 65%)
HSB
hsb(6, 12%, 69%)
CMYK
cmyk(0%, 11%, 12%, 31%)
Oklch
oklch(71.2% 0.023 24.9)

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

#BC7487

Dark Violet · LightCoral · Rose Pink

HEX
#BC7487
RGB
rgb(188, 116, 135)
HSL
hsl(344, 35%, 60%)
HSB
hsb(344, 38%, 74%)
CMYK
cmyk(0%, 38%, 28%, 26%)
Oklch
oklch(64.1% 0.093 3.0)

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

#C4186B

Dark Violet · MediumVioletRed · Camellia

HEX
#C4186B
RGB
rgb(196, 24, 107)
HSL
hsl(331, 78%, 43%)
HSB
hsb(331, 88%, 77%)
CMYK
cmyk(0%, 88%, 45%, 23%)
Oklch
oklch(54.0% 0.207 359.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D9BFA3
A4BEDA

Analogous

DAA5A4
D9BFA3
D9DAA4

Triadic

D9BFA3
A4DAC0
C0A4DA

Split-Comp.

D9BFA3
A4D9DA
A5A4DA

Tetradic

D9BFA3
A4DAA5
A4BEDA
DAA4D9

Contrast Matrix WCAG 2.1 Contrast

D9BFA3
AABFB5
B09D9B
BC7487
C4186B
—
1.1
Fail
1.5
Fail
2.0
Fail
3.2
AA Large
1.1
Fail
—
1.3
Fail
1.8
Fail
2.9
Fail
1.5
Fail
1.3
Fail
—
1.4
Fail
2.2
Fail
2.0
Fail
1.8
Fail
1.4
Fail
—
1.6
Fail
3.2
AA Large
2.9
Fail
2.2
Fail
1.6
Fail
—
White BG
1.8Fail
1.9Fail
2.6Fail
3.5AA Large
5.7AA
Black BG
11.9AAA
10.8AAA
8.1AAA
6.0AA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECEAA
B3B3B7
A8A89B
9D9C82
7A7857

Deuteranopia

CFD1AB
B2B0B8
A9AA9C
A1A681
849052

Tritanopia

D8AFB0
ABB9BA
AF9C9C
B87F7E
BB4744

Achromatopsia

C4C4C4
B8B8B8
A2A2A2
8C8C8C
555555

Shades & Tints Shades & Tints

#D9BFA3

Dark
Light

#AABFB5

Dark
Light

#B09D9B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d9bfa3;
  --color-2: #aabfb5;
  --color-3: #b09d9b;
  --color-4: #bc7487;
  --color-5: #c4186b;
}

SCSS

$color-1: #d9bfa3;
$color-2: #aabfb5;
$color-3: #b09d9b;
$color-4: #bc7487;
$color-5: #c4186b;

TAILWIND

colors: {
  'brand-1': '#d9bfa3',
  'brand-2': '#aabfb5',
  'brand-3': '#b09d9b',
  'brand-4': '#bc7487',
  'brand-5': '#c4186b',
}

RGB Array

[217, 191, 163], [170, 191, 181], [176, 157, 155], [188, 116, 135], [196, 24, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D9BFA3, #AABFB5, #B09D9B, #BC7487, #C4186B is ideal for: corporate websites, product showcases, portfolios. 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: #d9bfa3; --color-2: #aabfb5; --color-3: #b09d9b; --color-4: #bc7487; --color-5: #c4186b. 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. 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