← Back to Editor

#7D677E · #4F2C4D · #360B41 · #CCC9AA · #FAFDEA

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

#7D677E

Dark Plum · Gray · Violet

HEX
#7D677E
RGB
rgb(125, 103, 126)
HSL
hsl(297, 10%, 45%)
HSB
hsb(297, 18%, 49%)
CMYK
cmyk(1%, 18%, 0%, 51%)
Oklch
oklch(54.3% 0.044 324.8)

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

#4F2C4D

Rose Purple · DarkSlateGray · Eggplant

HEX
#4F2C4D
RGB
rgb(79, 44, 77)
HSL
hsl(303, 28%, 24%)
HSB
hsb(303, 44%, 31%)
CMYK
cmyk(0%, 44%, 3%, 69%)
Oklch
oklch(35.1% 0.072 329.0)

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

#360B41

Royal Purple · MidnightBlue · Dark Purple

HEX
#360B41
RGB
rgb(54, 11, 65)
HSL
hsl(288, 71%, 15%)
HSB
hsb(288, 83%, 25%)
CMYK
cmyk(17%, 83%, 0%, 75%)
Oklch
oklch(25.5% 0.102 318.5)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#CCC9AA

Fresh Green · Silver · Sunflower

HEX
#CCC9AA
RGB
rgb(204, 201, 170)
HSL
hsl(55, 25%, 73%)
HSB
hsb(55, 17%, 80%)
CMYK
cmyk(0%, 1%, 17%, 20%)
Oklch
oklch(83.0% 0.042 102.7)

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

#FAFDEA

Fresh Green · SeaShell · Lemon Cream

HEX
#FAFDEA
RGB
rgb(250, 253, 234)
HSL
hsl(69, 83%, 95%)
HSB
hsb(69, 8%, 99%)
CMYK
cmyk(1%, 0%, 8%, 1%)
Oklch
oklch(98.7% 0.025 114.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7D677E
687E67

Analogous

72677E
7D677E
7E6774

Triadic

7D677E
7E7D67
677E7D

Split-Comp.

7D677E
747E67
677E72

Tetradic

7D677E
7E7267
687E67
67747E

Contrast Matrix WCAG 2.1 Contrast

7D677E
4F2C4D
360B41
CCC9AA
FAFDEA
—
2.3
Fail
3.2
AA Large
3.0
AA Large
4.9
AA
2.3
Fail
—
1.4
Fail
6.9
AA
11.3
AAA
3.2
AA Large
1.4
Fail
—
9.8
AAA
15.8
AAA
3.0
AA Large
6.9
AA
9.8
AAA
—
1.6
Fail
4.9
AA
11.3
AAA
15.8
AAA
1.6
Fail
—
White BG
5.1AA
11.7AAA
16.4AAA
1.7Fail
1.0Fail
Black BG
4.1AA Large
1.8Fail
1.3Fail
12.5AAA
20.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

737378
404045
232334
CBCBB2
FBFBEF

Deuteranopia

757677
424543
262931
CBCBB3
FBFBF0

Tritanopia

7C7473
4D3F3D
342A27
CCB7B9
FAF2F3

Achromatopsia

707070
3A3A3A
1E1E1E
C6C6C6
FAFAFA

Shades & Tints Shades & Tints

#7D677E

Dark
Light

#4F2C4D

Dark
Light

#360B41

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7d677e;
  --color-2: #4f2c4d;
  --color-3: #360b41;
  --color-4: #ccc9aa;
  --color-5: #fafdea;
}

SCSS

$color-1: #7d677e;
$color-2: #4f2c4d;
$color-3: #360b41;
$color-4: #ccc9aa;
$color-5: #fafdea;

TAILWIND

colors: {
  'brand-1': '#7d677e',
  'brand-2': '#4f2c4d',
  'brand-3': '#360b41',
  'brand-4': '#ccc9aa',
  'brand-5': '#fafdea',
}

RGB Array

[125, 103, 126], [79, 44, 77], [54, 11, 65], [204, 201, 170], [250, 253, 234]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7D677E, #4F2C4D, #360B41, #CCC9AA, #FAFDEA 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: #7d677e; --color-2: #4f2c4d; --color-3: #360b41; --color-4: #ccc9aa; --color-5: #fafdea. 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