← Back to Editor

#9F637A · #C2A3D6 · #D6C2A3 · #61594E · #332F2A

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

#9F637A

Dark Violet · Gray · Rose Pink

HEX
#9F637A
RGB
rgb(159, 99, 122)
HSL
hsl(337, 24%, 51%)
HSB
hsb(337, 38%, 62%)
CMYK
cmyk(0%, 38%, 23%, 38%)
Oklch
oklch(57.2% 0.083 355.5)

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

#C2A3D6

Lilac · Silver · Lilac Purple

HEX
#C2A3D6
RGB
rgb(194, 163, 214)
HSL
hsl(276, 38%, 74%)
HSB
hsb(276, 24%, 84%)
CMYK
cmyk(9%, 24%, 0%, 16%)
Oklch
oklch(76.0% 0.079 311.9)

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

#D6C2A3

Goose Yellow · Tan · Warm Sun

HEX
#D6C2A3
RGB
rgb(214, 194, 163)
HSL
hsl(36, 38%, 74%)
HSB
hsb(36, 24%, 84%)
CMYK
cmyk(0%, 9%, 24%, 16%)
Oklch
oklch(82.3% 0.048 78.8)

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

#61594E

Ochre · DimGray · Amber Brown

HEX
#61594E
RGB
rgb(97, 89, 78)
HSL
hsl(35, 11%, 34%)
HSB
hsb(35, 20%, 38%)
CMYK
cmyk(0%, 8%, 20%, 62%)
Oklch
oklch(46.8% 0.020 75.9)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#332F2A

Ochre · DarkSlateGray · Cinnamon

HEX
#332F2A
RGB
rgb(51, 47, 42)
HSL
hsl(33, 10%, 18%)
HSB
hsb(33, 18%, 20%)
CMYK
cmyk(0%, 8%, 18%, 80%)
Oklch
oklch(30.8% 0.010 73.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9F637A
64A089

Analogous

A06499
9F637A
A06B64

Triadic

9F637A
7BA064
647BA0

Split-Comp.

9F637A
64A06B
6499A0

Tetradic

9F637A
99A064
64A089
6B64A0

Contrast Matrix WCAG 2.1 Contrast

9F637A
C2A3D6
D6C2A3
61594E
332F2A
—
2.1
Fail
2.7
Fail
1.5
Fail
2.9
Fail
2.1
Fail
—
1.3
Fail
3.1
AA Large
6.0
AA
2.7
Fail
1.3
Fail
—
4.0
AA Large
7.7
AAA
1.5
Fail
3.1
AA Large
4.0
AA Large
—
1.9
Fail
2.9
Fail
6.0
AA
7.7
AAA
1.9
Fail
—
White BG
4.6AA
2.2Fail
1.7Fail
6.9AA
13.3AAA
Black BG
4.5AA
9.5AAA
12.1AAA
3.0AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

858474
B5B4CA
CDCDAB
5E5D51
31312B

Deuteranopia

898D73
B6B9C7
CFD0AC
5E5F51
32322C

Tritanopia

9C706F
C0C0BE
D5B0B2
615353
332C2C

Achromatopsia

787878
B2B2B2
C4C4C4
5A5A5A
303030

Shades & Tints Shades & Tints

#9F637A

Dark
Light

#C2A3D6

Dark
Light

#D6C2A3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9f637a;
  --color-2: #c2a3d6;
  --color-3: #d6c2a3;
  --color-4: #61594e;
  --color-5: #332f2a;
}

SCSS

$color-1: #9f637a;
$color-2: #c2a3d6;
$color-3: #d6c2a3;
$color-4: #61594e;
$color-5: #332f2a;

TAILWIND

colors: {
  'brand-1': '#9f637a',
  'brand-2': '#c2a3d6',
  'brand-3': '#d6c2a3',
  'brand-4': '#61594e',
  'brand-5': '#332f2a',
}

RGB Array

[159, 99, 122], [194, 163, 214], [214, 194, 163], [97, 89, 78], [51, 47, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9F637A, #C2A3D6, #D6C2A3, #61594E, #332F2A is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #9f637a; --color-2: #c2a3d6; --color-3: #d6c2a3; --color-4: #61594e; --color-5: #332f2a. 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. Restrained colors convey professionalism and trust. 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