← Back to Editor

#D2ABAC · #7E6578 · #57516B · #37304F · #1F2032

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#D2ABAC

Peach Pink · Tan · Coral Red

HEX
#D2ABAC
RGB
rgb(210, 171, 172)
HSL
hsl(358, 30%, 75%)
HSB
hsb(358, 19%, 82%)
CMYK
cmyk(0%, 19%, 18%, 18%)
Oklch
oklch(77.6% 0.046 16.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#7E6578

Rose Purple · DimGray · Violet

HEX
#7E6578
RGB
rgb(126, 101, 120)
HSL
hsl(314, 11%, 45%)
HSB
hsb(314, 20%, 49%)
CMYK
cmyk(0%, 20%, 5%, 51%)
Oklch
oklch(53.8% 0.042 334.7)

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

#57516B

Deep Indigo · DimGray · Prussian Blue

HEX
#57516B
RGB
rgb(87, 81, 107)
HSL
hsl(254, 14%, 37%)
HSB
hsb(254, 24%, 42%)
CMYK
cmyk(19%, 24%, 0%, 58%)
Oklch
oklch(45.1% 0.043 295.2)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#37304F

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#37304F
RGB
rgb(55, 48, 79)
HSL
hsl(254, 24%, 25%)
HSB
hsb(254, 39%, 31%)
CMYK
cmyk(30%, 39%, 0%, 69%)
Oklch
oklch(33.1% 0.054 293.6)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#1F2032

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#1F2032
RGB
rgb(31, 32, 50)
HSL
hsl(237, 23%, 16%)
HSB
hsb(237, 38%, 20%)
CMYK
cmyk(38%, 36%, 0%, 80%)
Oklch
oklch(25.1% 0.034 281.2)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D2ABAC
ACD2D1

Analogous

D2ACC1
D2ABAC
D2BEAC

Triadic

D2ABAC
ADD2AC
ACADD2

Split-Comp.

D2ABAC
ACD2BE
ACC1D2

Tetradic

D2ABAC
C1D2AC
ACD2D1
BEACD2

Contrast Matrix WCAG 2.1 Contrast

D2ABAC
7E6578
57516B
37304F
1F2032
—
2.5
Fail
3.6
AA Large
6.0
AA
7.8
AAA
2.5
Fail
—
1.4
Fail
2.4
Fail
3.1
AA Large
3.6
AA Large
1.4
Fail
—
1.6
Fail
2.1
Fail
6.0
AA
2.4
Fail
1.6
Fail
—
1.3
Fail
7.8
AAA
3.1
AA Large
2.1
Fail
1.3
Fail
—
White BG
2.1Fail
5.2AA
7.5AAA
12.4AAA
16.0AAA
Black BG
10.2AAA
4.0AA Large
2.8Fail
1.7Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C1AC
737373
545465
343447
1F1F2E

Deuteranopia

C3C6AC
757672
555563
343546
1F1F2D

Tritanopia

D0ACAC
7D706F
57605F
374240
1F2A29

Achromatopsia

B7B7B7
6F6F6F
565656
363636
222222

Shades & Tints Shades & Tints

#D2ABAC

Dark
Light

#7E6578

Dark
Light

#57516B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d2abac;
  --color-2: #7e6578;
  --color-3: #57516b;
  --color-4: #37304f;
  --color-5: #1f2032;
}

SCSS

$color-1: #d2abac;
$color-2: #7e6578;
$color-3: #57516b;
$color-4: #37304f;
$color-5: #1f2032;

TAILWIND

colors: {
  'brand-1': '#d2abac',
  'brand-2': '#7e6578',
  'brand-3': '#57516b',
  'brand-4': '#37304f',
  'brand-5': '#1f2032',
}

RGB Array

[210, 171, 172], [126, 101, 120], [87, 81, 107], [55, 48, 79], [31, 32, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D2ABAC, #7E6578, #57516B, #37304F, #1F2032 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, 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: #d2abac; --color-2: #7e6578; --color-3: #57516b; --color-4: #37304f; --color-5: #1f2032. 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 general-style 5-color scheme is especially suited for finance, legal, luxury 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