← Back to Editor

#5F4258 · #A8698C · #ACA28F · #ABC492 · #EBFAE0

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

#5F4258

Rose Purple · DimGray · Eggplant

HEX
#5F4258
RGB
rgb(95, 66, 88)
HSL
hsl(314, 18%, 32%)
HSB
hsb(314, 31%, 37%)
CMYK
cmyk(0%, 31%, 7%, 63%)
Oklch
oklch(41.9% 0.052 335.5)

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

#A8698C

Rose Purple · Gray · Rose Pink

HEX
#A8698C
RGB
rgb(168, 105, 140)
HSL
hsl(327, 27%, 54%)
HSB
hsb(327, 38%, 66%)
CMYK
cmyk(0%, 38%, 17%, 34%)
Oklch
oklch(60.0% 0.093 345.8)

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

#ACA28F

Ginger · DarkGray · Warm Sun

HEX
#ACA28F
RGB
rgb(172, 162, 143)
HSL
hsl(39, 15%, 62%)
HSB
hsb(39, 17%, 67%)
CMYK
cmyk(0%, 6%, 17%, 33%)
Oklch
oklch(71.5% 0.029 83.5)

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

#ABC492

Celadon · DarkSeaGreen · Apple Green

HEX
#ABC492
RGB
rgb(171, 196, 146)
HSL
hsl(90, 30%, 67%)
HSB
hsb(90, 26%, 77%)
CMYK
cmyk(13%, 0%, 26%, 23%)
Oklch
oklch(78.9% 0.074 129.6)

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

#EBFAE0

Emerald · Beige · Mint Green

HEX
#EBFAE0
RGB
rgb(235, 250, 224)
HSL
hsl(95, 72%, 93%)
HSB
hsb(95, 10%, 98%)
CMYK
cmyk(6%, 0%, 10%, 2%)
Oklch
oklch(96.7% 0.038 131.8)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5F4258
43604A

Analogous

584360
5F4258
60434B

Triadic

5F4258
596043
435960

Split-Comp.

5F4258
4B6043
436058

Tetradic

5F4258
605843
43604A
434B60

Contrast Matrix WCAG 2.1 Contrast

5F4258
A8698C
ACA28F
ABC492
EBFAE0
—
2.1
Fail
3.5
AA Large
4.6
AA
8.0
AAA
2.1
Fail
—
1.6
Fail
2.2
Fail
3.8
AA Large
3.5
AA Large
1.6
Fail
—
1.3
Fail
2.3
Fail
4.6
AA
2.2
Fail
1.3
Fail
—
1.7
Fail
8.0
AAA
3.8
AA Large
2.3
Fail
1.7
Fail
—
White BG
8.7AAA
4.1AA Large
2.5Fail
1.9Fail
1.1Fail
Black BG
2.4Fail
5.1AA
8.3AAA
11.0AAA
19.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

525253
8D8C84
A8A894
B6B69E
F1F2E6

Deuteranopia

545651
909582
A8A995
B4B3A1
F1F0E8

Tritanopia

5E4E4E
A57D7B
AC9798
ACA8AA
ECEBEC

Achromatopsia

4D4D4D
808080
A3A3A3
B7B7B7
F3F3F3

Shades & Tints Shades & Tints

#5F4258

Dark
Light

#A8698C

Dark
Light

#ACA28F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5f4258;
  --color-2: #a8698c;
  --color-3: #aca28f;
  --color-4: #abc492;
  --color-5: #ebfae0;
}

SCSS

$color-1: #5f4258;
$color-2: #a8698c;
$color-3: #aca28f;
$color-4: #abc492;
$color-5: #ebfae0;

TAILWIND

colors: {
  'brand-1': '#5f4258',
  'brand-2': '#a8698c',
  'brand-3': '#aca28f',
  'brand-4': '#abc492',
  'brand-5': '#ebfae0',
}

RGB Array

[95, 66, 88], [168, 105, 140], [172, 162, 143], [171, 196, 146], [235, 250, 224]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5F4258, #A8698C, #ACA28F, #ABC492, #EBFAE0 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: #5f4258; --color-2: #a8698c; --color-3: #aca28f; --color-4: #abc492; --color-5: #ebfae0. 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