← Back to Editor

#614051 · #586A6A · #ADBCA5 · #FCB97D · #948D9B

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

#614051

Rose Purple · DimGray · Camellia

HEX
#614051
RGB
rgb(97, 64, 81)
HSL
hsl(329, 20%, 32%)
HSB
hsb(329, 34%, 38%)
CMYK
cmyk(0%, 34%, 16%, 62%)
Oklch
oklch(41.5% 0.052 347.4)

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

#586A6A

Slate Blue · DimGray · Charcoal

HEX
#586A6A
RGB
rgb(88, 106, 106)
HSL
hsl(180, 9%, 38%)
HSB
hsb(180, 17%, 42%)
CMYK
cmyk(17%, 0%, 0%, 58%)
Oklch
oklch(50.9% 0.022 196.5)

Traditional「Slate Blue」· Paint「Charcoal」· Creative Midnight Shadow

#ADBCA5

Celadon · DarkGray · Apple Green

HEX
#ADBCA5
RGB
rgb(173, 188, 165)
HSL
hsl(99, 15%, 69%)
HSB
hsb(99, 12%, 74%)
CMYK
cmyk(8%, 0%, 12%, 26%)
Oklch
oklch(77.7% 0.036 134.6)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#FCB97D

Apricot · LightSalmon · Warm Sun

HEX
#FCB97D
RGB
rgb(252, 185, 125)
HSL
hsl(28, 95%, 74%)
HSB
hsb(28, 50%, 99%)
CMYK
cmyk(0%, 27%, 50%, 1%)
Oklch
oklch(83.5% 0.109 62.3)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#948D9B

Ash · LightSlateGray · Silver Sand

HEX
#948D9B
RGB
rgb(148, 141, 155)
HSL
hsl(270, 7%, 58%)
HSB
hsb(270, 9%, 61%)
CMYK
cmyk(5%, 9%, 0%, 39%)
Oklch
oklch(65.4% 0.022 308.1)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

614051
416251

Analogous

614162
614051
624142

Triadic

614051
526241
415262

Split-Comp.

614051
426241
416261

Tetradic

614051
626141
416251
414262

Contrast Matrix WCAG 2.1 Contrast

614051
586A6A
ADBCA5
FCB97D
948D9B
—
1.6
Fail
4.5
AA Large
5.2
AA
2.8
Fail
1.6
Fail
—
2.9
Fail
3.4
AA Large
1.8
Fail
4.5
AA Large
2.9
Fail
—
1.2
Fail
1.6
Fail
5.2
AA
3.4
AA Large
1.2
Fail
—
1.9
Fail
2.8
Fail
1.8
Fail
1.6
Fail
1.9
Fail
—
White BG
8.9AAA
5.7AA
2.0Fail
1.7Fail
3.2AA Large
Black BG
2.4Fail
3.7AA Large
10.5AAA
12.4AAA
6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

53524D
60606A
B3B4AB
DFDE8C
919198

Deuteranopia

55574C
5F5D6A
B3B2AC
E3E88F
919297

Tritanopia

5F4A49
596A6A
AEAFB0
F9979A
949594

Achromatopsia

4C4C4C
656565
B5B5B5
C6C6C6
919191

Shades & Tints Shades & Tints

#614051

Dark
Light

#586A6A

Dark
Light

#ADBCA5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #614051;
  --color-2: #586a6a;
  --color-3: #adbca5;
  --color-4: #fcb97d;
  --color-5: #948d9b;
}

SCSS

$color-1: #614051;
$color-2: #586a6a;
$color-3: #adbca5;
$color-4: #fcb97d;
$color-5: #948d9b;

TAILWIND

colors: {
  'brand-1': '#614051',
  'brand-2': '#586a6a',
  'brand-3': '#adbca5',
  'brand-4': '#fcb97d',
  'brand-5': '#948d9b',
}

RGB Array

[97, 64, 81], [88, 106, 106], [173, 188, 165], [252, 185, 125], [148, 141, 155]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #614051, #586A6A, #ADBCA5, #FCB97D, #948D9B 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: #614051; --color-2: #586a6a; --color-3: #adbca5; --color-4: #fcb97d; --color-5: #948d9b. 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