← Back to Editor

#D28DAC · #202836 · #3C4D73 · #266073 · #0F737A

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

#D28DAC

Rouge · DarkGray · Rose Pink

HEX
#D28DAC
RGB
rgb(210, 141, 172)
HSL
hsl(333, 43%, 69%)
HSB
hsb(333, 33%, 82%)
CMYK
cmyk(0%, 33%, 18%, 18%)
Oklch
oklch(72.2% 0.092 351.1)

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

#202836

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#202836
RGB
rgb(32, 40, 54)
HSL
hsl(218, 26%, 17%)
HSB
hsb(218, 41%, 21%)
CMYK
cmyk(41%, 26%, 0%, 79%)
Oklch
oklch(27.6% 0.028 261.5)

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

#3C4D73

Indigo · DarkSlateBlue · Prussian Blue

HEX
#3C4D73
RGB
rgb(60, 77, 115)
HSL
hsl(221, 31%, 34%)
HSB
hsb(221, 48%, 45%)
CMYK
cmyk(48%, 33%, 0%, 55%)
Oklch
oklch(42.3% 0.067 265.2)

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

#266073

Slate Blue · DarkSlateGray · Mint Ice

HEX
#266073
RGB
rgb(38, 96, 115)
HSL
hsl(195, 50%, 30%)
HSB
hsb(195, 67%, 45%)
CMYK
cmyk(67%, 17%, 0%, 55%)
Oklch
oklch(45.9% 0.067 222.8)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#0F737A

Lake Blue · Teal · Mint Ice

HEX
#0F737A
RGB
rgb(15, 115, 122)
HSL
hsl(184, 78%, 27%)
HSB
hsb(184, 88%, 48%)
CMYK
cmyk(88%, 6%, 0%, 52%)
Oklch
oklch(50.7% 0.083 202.6)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D28DAC
8ED2B3

Analogous

D28ECF
D28DAC
D2918E

Triadic

D28DAC
ADD28E
8EADD2

Split-Comp.

D28DAC
8ED291
8ECFD2

Tetradic

D28DAC
CFD28E
8ED2B3
918ED2

Contrast Matrix WCAG 2.1 Contrast

D28DAC
202836
3C4D73
266073
0F737A
—
5.7
AA
3.3
AA Large
2.7
Fail
2.2
Fail
5.7
AA
—
1.8
Fail
2.1
Fail
2.6
Fail
3.3
AA Large
1.8
Fail
—
1.2
Fail
1.5
Fail
2.7
Fail
2.1
Fail
1.2
Fail
—
1.2
Fail
2.2
Fail
2.6
Fail
1.5
Fail
1.2
Fail
—
White BG
2.6Fail
14.8AAA
8.4AAA
7.0AA
5.6AA
Black BG
8.1AAA
1.4Fail
2.5Fail
3.0AA Large
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B4A4
232433
43446A
3F406E
3A3B78

Deuteranopia

B8BDA3
232232
424168
3C376D
352D78

Tritanopia

CF9F9D
20302F
3D6361
296B6A
147777

Achromatopsia

A5A5A5
272727
4C4C4C
515151
565656

Shades & Tints Shades & Tints

#D28DAC

Dark
Light

#202836

Dark
Light

#3C4D73

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d28dac;
  --color-2: #202836;
  --color-3: #3c4d73;
  --color-4: #266073;
  --color-5: #0f737a;
}

SCSS

$color-1: #d28dac;
$color-2: #202836;
$color-3: #3c4d73;
$color-4: #266073;
$color-5: #0f737a;

TAILWIND

colors: {
  'brand-1': '#d28dac',
  'brand-2': '#202836',
  'brand-3': '#3c4d73',
  'brand-4': '#266073',
  'brand-5': '#0f737a',
}

RGB Array

[210, 141, 172], [32, 40, 54], [60, 77, 115], [38, 96, 115], [15, 115, 122]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D28DAC, #202836, #3C4D73, #266073, #0F737A 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: #d28dac; --color-2: #202836; --color-3: #3c4d73; --color-4: #266073; --color-5: #0f737a. 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 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