← Back to Editor

#765E5E · #DC53F3 · #D779D6 · #D1A0BA · #CCC69D

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

#765E5E

Crimson · DimGray · Passion Red

HEX
#765E5E
RGB
rgb(118, 94, 94)
HSL
hsl(0, 11%, 42%)
HSB
hsb(0, 20%, 46%)
CMYK
cmyk(0%, 20%, 20%, 54%)
Oklch
oklch(50.6% 0.031 18.2)

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

#DC53F3

Lilac · Orchid · Lilac Purple

HEX
#DC53F3
RGB
rgb(220, 83, 243)
HSL
hsl(291, 87%, 64%)
HSB
hsb(291, 66%, 95%)
CMYK
cmyk(9%, 66%, 0%, 5%)
Oklch
oklch(68.5% 0.249 321.6)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#D779D6

Mauve · Orchid · Lilac Purple

HEX
#D779D6
RGB
rgb(215, 121, 214)
HSL
hsl(301, 54%, 66%)
HSB
hsb(301, 44%, 84%)
CMYK
cmyk(0%, 44%, 0%, 16%)
Oklch
oklch(71.1% 0.165 327.5)

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

#D1A0BA

Mauve · Silver · Rose Pink

HEX
#D1A0BA
RGB
rgb(209, 160, 186)
HSL
hsl(328, 35%, 72%)
HSB
hsb(328, 23%, 82%)
CMYK
cmyk(0%, 23%, 11%, 18%)
Oklch
oklch(75.9% 0.067 345.7)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#CCC69D

Fresh Green · Tan · Sunflower

HEX
#CCC69D
RGB
rgb(204, 198, 157)
HSL
hsl(52, 32%, 71%)
HSB
hsb(52, 23%, 80%)
CMYK
cmyk(0%, 3%, 23%, 20%)
Oklch
oklch(82.1% 0.055 100.6)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

765E5E
5F7777

Analogous

775F6B
765E5E
776B5F

Triadic

765E5E
5F775F
5F5F77

Split-Comp.

765E5E
5F776B
5F6B77

Tetradic

765E5E
6B775F
5F7777
6B5F77

Contrast Matrix WCAG 2.1 Contrast

765E5E
DC53F3
D779D6
D1A0BA
CCC69D
—
1.9
Fail
2.1
Fail
2.7
Fail
3.4
AA Large
1.9
Fail
—
1.2
Fail
1.4
Fail
1.8
Fail
2.1
Fail
1.2
Fail
—
1.2
Fail
1.6
Fail
2.7
Fail
1.4
Fail
1.2
Fail
—
1.3
Fail
3.4
AA Large
1.8
Fail
1.6
Fail
1.3
Fail
—
White BG
5.9AA
3.2AA Large
2.8Fail
2.2Fail
1.7Fail
Black BG
3.5AA Large
6.6AA
7.6AAA
9.4AAA
12.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6C6B5E
A19FCC
AEADBF
BCBBB4
C9C9A7

Deuteranopia

6D6F5E
A9B3C3
B4BBBA
BFC2B2
CACAA9

Tritanopia

755E5E
D5AEA7
D2AEAA
CFAFAE
CCAFB0

Achromatopsia

656565
8E8E8E
A0A0A0
B2B2B2
C3C3C3

Shades & Tints Shades & Tints

#765E5E

Dark
Light

#DC53F3

Dark
Light

#D779D6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #765e5e;
  --color-2: #dc53f3;
  --color-3: #d779d6;
  --color-4: #d1a0ba;
  --color-5: #ccc69d;
}

SCSS

$color-1: #765e5e;
$color-2: #dc53f3;
$color-3: #d779d6;
$color-4: #d1a0ba;
$color-5: #ccc69d;

TAILWIND

colors: {
  'brand-1': '#765e5e',
  'brand-2': '#dc53f3',
  'brand-3': '#d779d6',
  'brand-4': '#d1a0ba',
  'brand-5': '#ccc69d',
}

RGB Array

[118, 94, 94], [220, 83, 243], [215, 121, 214], [209, 160, 186], [204, 198, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #765E5E, #DC53F3, #D779D6, #D1A0BA, #CCC69D 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: #765e5e; --color-2: #dc53f3; --color-3: #d779d6; --color-4: #d1a0ba; --color-5: #ccc69d. 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