← Back to Editor

#D3C7FC · #CE89C2 · #B36A77 · #83691A · #382F23

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 LibraryData Visualization

Color Details Color Details

#D3C7FC

Wisteria · Lavender · Sky Blue

HEX
#D3C7FC
RGB
rgb(211, 199, 252)
HSL
hsl(254, 90%, 88%)
HSB
hsb(254, 21%, 99%)
CMYK
cmyk(16%, 21%, 0%, 1%)
Oklch
oklch(85.7% 0.074 295.2)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#CE89C2

Mauve · Orchid · Lilac Purple

HEX
#CE89C2
RGB
rgb(206, 137, 194)
HSL
hsl(310, 41%, 67%)
HSB
hsb(310, 33%, 81%)
CMYK
cmyk(0%, 33%, 6%, 19%)
Oklch
oklch(71.8% 0.112 333.1)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#B36A77

Crimson · Gray · Passion Red

HEX
#B36A77
RGB
rgb(179, 106, 119)
HSL
hsl(349, 32%, 56%)
HSB
hsb(349, 41%, 70%)
CMYK
cmyk(0%, 41%, 34%, 30%)
Oklch
oklch(60.8% 0.094 8.8)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#83691A

Ochre · Olive · Honey Gold

HEX
#83691A
RGB
rgb(131, 105, 26)
HSL
hsl(45, 67%, 31%)
HSB
hsb(45, 80%, 51%)
CMYK
cmyk(0%, 20%, 80%, 49%)
Oklch
oklch(53.2% 0.099 89.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#382F23

Ochre · DarkSlateGray · Cinnamon

HEX
#382F23
RGB
rgb(56, 47, 35)
HSL
hsl(34, 23%, 18%)
HSB
hsb(34, 37%, 22%)
CMYK
cmyk(0%, 16%, 38%, 78%)
Oklch
oklch(31.1% 0.024 74.7)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3C7FC
EFFCC5

Analogous

C5D4FC
D3C7FC
EDC5FC

Triadic

D3C7FC
FCD2C5
C5FCD2

Split-Comp.

D3C7FC
FCEDC5
D4FCC5

Tetradic

D3C7FC
FCC5D4
EFFCC5
C5FCED

Contrast Matrix WCAG 2.1 Contrast

D3C7FC
CE89C2
B36A77
83691A
382F23
—
1.7
Fail
2.5
Fail
3.3
AA Large
8.3
AAA
1.7
Fail
—
1.5
Fail
2.0
Fail
5.0
AA
2.5
Fail
1.5
Fail
—
1.3
Fail
3.3
AA Large
3.3
AA Large
2.0
Fail
1.3
Fail
—
2.5
Fail
8.3
AAA
5.0
AA
3.3
AA Large
2.5
Fail
—
White BG
1.6Fail
2.6Fail
4.0AA Large
5.2AA
13.1AAA
Black BG
13.3AAA
8.0AAA
5.2AA
4.0AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECEEF
B0B0B4
939374
78782D
343426

Deuteranopia

CFCFEC
B4B9B1
989D73
797B32
353527

Tritanopia

D2E5E3
CBA9A7
AF7171
823C40
382829

Achromatopsia

D1D1D1
A4A4A4
818181
686868
303030

Shades & Tints Shades & Tints

#D3C7FC

Dark
Light

#CE89C2

Dark
Light

#B36A77

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3c7fc;
  --color-2: #ce89c2;
  --color-3: #b36a77;
  --color-4: #83691a;
  --color-5: #382f23;
}

SCSS

$color-1: #d3c7fc;
$color-2: #ce89c2;
$color-3: #b36a77;
$color-4: #83691a;
$color-5: #382f23;

TAILWIND

colors: {
  'brand-1': '#d3c7fc',
  'brand-2': '#ce89c2',
  'brand-3': '#b36a77',
  'brand-4': '#83691a',
  'brand-5': '#382f23',
}

RGB Array

[211, 199, 252], [206, 137, 194], [179, 106, 119], [131, 105, 26], [56, 47, 35]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D3C7FC, #CE89C2, #B36A77, #83691A, #382F23 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: #d3c7fc; --color-2: #ce89c2; --color-3: #b36a77; --color-4: #83691a; --color-5: #382f23. 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