← Back to Editor

#B88969 · #D77070 · #E15C87 · #D958AA · #BE6DB4

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 Library

Color Details Color Details

#B88969

Tangerine · DarkSalmon · Warm Sun

HEX
#B88969
RGB
rgb(184, 137, 105)
HSL
hsl(24, 36%, 57%)
HSB
hsb(24, 43%, 72%)
CMYK
cmyk(0%, 26%, 43%, 28%)
Oklch
oklch(66.8% 0.073 55.4)

TraditionalTangerine」· PaintWarm Sun」· Creative Blush Sunrise

#D77070

Peach Pink · LightCoral · Coral Red

HEX
#D77070
RGB
rgb(215, 112, 112)
HSL
hsl(0, 56%, 64%)
HSB
hsb(0, 48%, 84%)
CMYK
cmyk(0%, 48%, 48%, 16%)
Oklch
oklch(66.3% 0.129 21.2)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#E15C87

Rouge · LightCoral · Rose Pink

HEX
#E15C87
RGB
rgb(225, 92, 135)
HSL
hsl(341, 69%, 62%)
HSB
hsb(341, 59%, 88%)
CMYK
cmyk(0%, 59%, 40%, 12%)
Oklch
oklch(65.5% 0.170 2.8)

TraditionalRouge」· PaintRose Pink」· Creative Rose Petal

#D958AA

Rose Purple · Orchid · Rose Pink

HEX
#D958AA
RGB
rgb(217, 88, 170)
HSL
hsl(322, 63%, 60%)
HSB
hsb(322, 59%, 85%)
CMYK
cmyk(0%, 59%, 22%, 15%)
Oklch
oklch(65.1% 0.184 344.4)

TraditionalRose Purple」· PaintRose Pink」· Creative Blush Sunrise

#BE6DB4

Rose Purple · MediumOrchid · Violet

HEX
#BE6DB4
RGB
rgb(190, 109, 180)
HSL
hsl(307, 38%, 59%)
HSB
hsb(307, 43%, 75%)
CMYK
cmyk(0%, 43%, 5%, 25%)
Oklch
oklch(64.9% 0.137 331.7)

TraditionalRose Purple」· PaintViolet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B88969
6A99B9

Analogous

B96A72
B88969
B9B16A

Triadic

B88969
6AB989
896AB9

Split-Comp.

B88969
6AB9B1
6A72B9

Tetradic

B88969
72B96A
6A99B9
B16AB9

Contrast Matrix WCAG 2.1 Contrast

B88969
D77070
E15C87
D958AA
BE6DB4
1.1
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.2
Fail
1.1
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
White BG
3.1AA Large
3.3AA Large
3.5AA Large
3.5AA Large
3.5AA Large
Black BG
6.8AA
6.4AA
6.1AA
5.9AA
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A371
AAA970
A7A67D
A1A096
9B9AA3

Deuteranopia

A6AA73
B0B870
AFB97A
A9B291
A0A69F

Tritanopia

B67778
D27070
DA7473
D38683
BA9592

Achromatopsia

939393
8F8F8F
898989
888888
8D8D8D

Shades & Tints Shades & Tints

#B88969

Dark
Light

#D77070

Dark
Light

#E15C87

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b88969;
  --color-2: #d77070;
  --color-3: #e15c87;
  --color-4: #d958aa;
  --color-5: #be6db4;
}

SCSS

$color-1: #b88969;
$color-2: #d77070;
$color-3: #e15c87;
$color-4: #d958aa;
$color-5: #be6db4;

TAILWIND

colors: {
  'brand-1': '#b88969',
  'brand-2': '#d77070',
  'brand-3': '#e15c87',
  'brand-4': '#d958aa',
  'brand-5': '#be6db4',
}

RGB Array

[184, 137, 105], [215, 112, 112], [225, 92, 135], [217, 88, 170], [190, 109, 180]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B88969, #D77070, #E15C87, #D958AA, #BE6DB4 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: #b88969; --color-2: #d77070; --color-3: #e15c87; --color-4: #d958aa; --color-5: #be6db4. 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