← Back to Editor

#983A68 · #EA3B5A · #DC525B · #BD6F58 · #DEB98D

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

#983A68

Dark Violet · Sienna · Camellia

HEX
#983A68
RGB
rgb(152, 58, 104)
HSL
hsl(331, 45%, 41%)
HSB
hsb(331, 62%, 60%)
CMYK
cmyk(0%, 62%, 32%, 40%)
Oklch
oklch(49.3% 0.135 352.8)

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

#EA3B5A

Vermilion · Tomato · Passion Red

HEX
#EA3B5A
RGB
rgb(234, 59, 90)
HSL
hsl(349, 81%, 57%)
HSB
hsb(349, 75%, 92%)
CMYK
cmyk(0%, 75%, 62%, 8%)
Oklch
oklch(62.4% 0.210 16.2)

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

#DC525B

Vermilion · Tomato · Passion Red

HEX
#DC525B
RGB
rgb(220, 82, 91)
HSL
hsl(356, 66%, 59%)
HSB
hsb(356, 63%, 86%)
CMYK
cmyk(0%, 63%, 59%, 14%)
Oklch
oklch(62.5% 0.173 19.8)

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

#BD6F58

Crimson · Sienna · Passion Red

HEX
#BD6F58
RGB
rgb(189, 111, 88)
HSL
hsl(14, 43%, 54%)
HSB
hsb(14, 53%, 74%)
CMYK
cmyk(0%, 41%, 53%, 26%)
Oklch
oklch(62.3% 0.105 37.2)

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

#DEB98D

Goose Yellow · BurlyWood · Warm Sun

HEX
#DEB98D
RGB
rgb(222, 185, 141)
HSL
hsl(33, 55%, 71%)
HSB
hsb(33, 36%, 87%)
CMYK
cmyk(0%, 17%, 36%, 13%)
Oklch
oklch(80.8% 0.072 71.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

983A68
3A986A

Analogous

983A96
983A68
983B3A

Triadic

983A68
67983A
3A6798

Split-Comp.

983A68
3A983B
3A9698

Tetradic

983A68
96983A
3A986A
3B3A98

Contrast Matrix WCAG 2.1 Contrast

983A68
EA3B5A
DC525B
BD6F58
DEB98D
—
1.7
Fail
1.7
Fail
1.8
Fail
3.6
AA Large
1.7
Fail
—
1.0
Fail
1.1
Fail
2.2
Fail
1.7
Fail
1.0
Fail
—
1.0
Fail
2.1
Fail
1.8
Fail
1.1
Fail
1.0
Fail
—
2.0
Fail
3.6
AA Large
2.2
Fail
2.1
Fail
2.0
Fail
—
White BG
6.7AA
4.0AA Large
3.9AA Large
3.8AA Large
1.8Fail
Black BG
3.1AA Large
5.3AA
5.4AA
5.6AA
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6F6E5D
9E9D52
A09F59
9B9B5E
CECE98

Deuteranopia

757C5A
A8B551
A8B358
A0A65F
D0D39A

Tritanopia

935452
E14D4B
D55757
B96263
DCA0A2

Achromatopsia

5B5B5B
737373
7C7C7C
848484
BFBFBF

Shades & Tints Shades & Tints

#983A68

Dark
Light

#EA3B5A

Dark
Light

#DC525B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #983a68;
  --color-2: #ea3b5a;
  --color-3: #dc525b;
  --color-4: #bd6f58;
  --color-5: #deb98d;
}

SCSS

$color-1: #983a68;
$color-2: #ea3b5a;
$color-3: #dc525b;
$color-4: #bd6f58;
$color-5: #deb98d;

TAILWIND

colors: {
  'brand-1': '#983a68',
  'brand-2': '#ea3b5a',
  'brand-3': '#dc525b',
  'brand-4': '#bd6f58',
  'brand-5': '#deb98d',
}

RGB Array

[152, 58, 104], [234, 59, 90], [220, 82, 91], [189, 111, 88], [222, 185, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #983A68, #EA3B5A, #DC525B, #BD6F58, #DEB98D 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: #983a68; --color-2: #ea3b5a; --color-3: #dc525b; --color-4: #bd6f58; --color-5: #deb98d. 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