← Back to Editor

#D980A5 · #BE3F6E · #912453 · #661B3D · #1D0E14

dark

A 5-color dark 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

#D980A5

Rouge · LightCoral · Rose Pink

HEX
#D980A5
RGB
rgb(217, 128, 165)
HSL
hsl(335, 54%, 68%)
HSB
hsb(335, 41%, 85%)
CMYK
cmyk(0%, 41%, 24%, 15%)
Oklch
oklch(70.6% 0.118 354.1)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#BE3F6E

Dark Violet · MediumVioletRed · Camellia

HEX
#BE3F6E
RGB
rgb(190, 63, 110)
HSL
hsl(338, 50%, 50%)
HSB
hsb(338, 67%, 75%)
CMYK
cmyk(0%, 67%, 42%, 25%)
Oklch
oklch(56.0% 0.167 1.4)

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

#912453

Dark Violet · Brown · Camellia

HEX
#912453
RGB
rgb(145, 36, 83)
HSL
hsl(334, 60%, 35%)
HSB
hsb(334, 75%, 57%)
CMYK
cmyk(0%, 75%, 43%, 43%)
Oklch
oklch(44.9% 0.149 359.0)

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

#661B3D

Dark Violet · Brown · Raspberry

HEX
#661B3D
RGB
rgb(102, 27, 61)
HSL
hsl(333, 58%, 25%)
HSB
hsb(333, 74%, 40%)
CMYK
cmyk(0%, 74%, 40%, 60%)
Oklch
oklch(35.5% 0.112 356.6)

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

#1D0E14

Dark Violet · Black · Raspberry

HEX
#1D0E14
RGB
rgb(29, 14, 20)
HSL
hsl(336, 35%, 8%)
HSB
hsb(336, 52%, 11%)
CMYK
cmyk(0%, 52%, 31%, 89%)
Oklch
oklch(18.8% 0.028 354.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D980A5
81D9B5

Analogous

D981D2
D980A5
D98981

Triadic

D980A5
A6D981
81A6D9

Split-Comp.

D980A5
81D989
81D2D9

Tetradic

D980A5
D2D981
81D9B5
8981D9

Contrast Matrix WCAG 2.1 Contrast

D980A5
BE3F6E
912453
661B3D
1D0E14
—
1.8
Fail
2.9
Fail
4.2
AA Large
6.7
AA
1.8
Fail
—
1.6
Fail
2.3
Fail
3.7
AA Large
2.9
Fail
1.6
Fail
—
1.4
Fail
2.3
Fail
4.2
AA Large
2.3
Fail
1.4
Fail
—
1.6
Fail
6.7
AA
3.7
AA Large
2.3
Fail
1.6
Fail
—
White BG
2.8Fail
5.1AA
8.1AAA
11.7AAA
18.7AAA
Black BG
7.6AAA
4.1AA Large
2.6Fail
1.8Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B2B29C
878663
626148
464535
171613

Deuteranopia

B8BE9A
8E9860
687045
4A4F33
171812

Tritanopia

D59593
B85A58
8C3F3D
622E2D
1C1111

Achromatopsia

9F9F9F
6A6A6A
4A4A4A
353535
131313

Shades & Tints Shades & Tints

#D980A5

Dark
Light

#BE3F6E

Dark
Light

#912453

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d980a5;
  --color-2: #be3f6e;
  --color-3: #912453;
  --color-4: #661b3d;
  --color-5: #1d0e14;
}

SCSS

$color-1: #d980a5;
$color-2: #be3f6e;
$color-3: #912453;
$color-4: #661b3d;
$color-5: #1d0e14;

TAILWIND

colors: {
  'brand-1': '#d980a5',
  'brand-2': '#be3f6e',
  'brand-3': '#912453',
  'brand-4': '#661b3d',
  'brand-5': '#1d0e14',
}

RGB Array

[217, 128, 165], [190, 63, 110], [145, 36, 83], [102, 27, 61], [29, 14, 20]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #D980A5, #BE3F6E, #912453, #661B3D, #1D0E14 is ideal for: tech websites, dark mode UIs, game UIs, 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: #d980a5; --color-2: #be3f6e; --color-3: #912453; --color-4: #661b3d; --color-5: #1d0e14. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 dark-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