← Back to Editor

#3D384F · #D12CA5 · #B281C0 · #93D6DB · #A4ADB0

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

#3D384F

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#3D384F
RGB
rgb(61, 56, 79)
HSL
hsl(253, 17%, 26%)
HSB
hsb(253, 29%, 31%)
CMYK
cmyk(23%, 29%, 0%, 69%)
Oklch
oklch(35.6% 0.040 294.3)

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

#D12CA5

Rose Purple · MediumVioletRed · Violet

HEX
#D12CA5
RGB
rgb(209, 44, 165)
HSL
hsl(316, 65%, 50%)
HSB
hsb(316, 79%, 82%)
CMYK
cmyk(0%, 79%, 21%, 18%)
Oklch
oklch(59.6% 0.229 341.6)

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

#B281C0

Lilac · DarkGray · Lilac Purple

HEX
#B281C0
RGB
rgb(178, 129, 192)
HSL
hsl(287, 33%, 63%)
HSB
hsb(287, 33%, 75%)
CMYK
cmyk(7%, 33%, 0%, 25%)
Oklch
oklch(67.4% 0.106 318.6)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#93D6DB

Sky Blue · SkyBlue · Lake Green

HEX
#93D6DB
RGB
rgb(147, 214, 219)
HSL
hsl(184, 50%, 72%)
HSB
hsb(184, 33%, 86%)
CMYK
cmyk(33%, 2%, 0%, 14%)
Oklch
oklch(83.3% 0.068 201.8)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#A4ADB0

Ash · DarkGray · Silver Sand

HEX
#A4ADB0
RGB
rgb(164, 173, 176)
HSL
hsl(195, 7%, 67%)
HSB
hsb(195, 7%, 69%)
CMYK
cmyk(7%, 2%, 0%, 31%)
Oklch
oklch(74.1% 0.011 219.6)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D384F
494E37

Analogous

373D4E
3D384F
47374E

Triadic

3D384F
4E3C37
374E3C

Split-Comp.

3D384F
4E4737
3D4E37

Tetradic

3D384F
4E373D
494E37
374E47

Contrast Matrix WCAG 2.1 Contrast

3D384F
D12CA5
B281C0
93D6DB
A4ADB0
—
2.5
Fail
3.6
AA Large
6.9
AA
4.9
AA
2.5
Fail
—
1.5
Fail
2.8
Fail
2.0
Fail
3.6
AA Large
1.5
Fail
—
1.9
Fail
1.4
Fail
6.9
AA
2.8
Fail
1.9
Fail
—
1.4
Fail
4.9
AA
2.0
Fail
1.4
Fail
1.4
Fail
—
White BG
11.2AAA
4.6AA
3.1AA Large
1.6Fail
2.3Fail
Black BG
1.9Fail
4.6AA
6.8AA
12.9AAA
9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3B3B49
8A8888
9D9CB1
B0B1DA
A8A8AF

Deuteranopia

3B3C48
939F81
A0A3AD
ACA7DA
A7A7AF

Tritanopia

3D4544
C9716C
B0A5A2
96D9D9
A4AFAF

Achromatopsia

3C3C3C
6B6B6B
979797
C3C3C3
ABABAB

Shades & Tints Shades & Tints

#3D384F

Dark
Light

#D12CA5

Dark
Light

#B281C0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d384f;
  --color-2: #d12ca5;
  --color-3: #b281c0;
  --color-4: #93d6db;
  --color-5: #a4adb0;
}

SCSS

$color-1: #3d384f;
$color-2: #d12ca5;
$color-3: #b281c0;
$color-4: #93d6db;
$color-5: #a4adb0;

TAILWIND

colors: {
  'brand-1': '#3d384f',
  'brand-2': '#d12ca5',
  'brand-3': '#b281c0',
  'brand-4': '#93d6db',
  'brand-5': '#a4adb0',
}

RGB Array

[61, 56, 79], [209, 44, 165], [178, 129, 192], [147, 214, 219], [164, 173, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3D384F, #D12CA5, #B281C0, #93D6DB, #A4ADB0 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: #3d384f; --color-2: #d12ca5; --color-3: #b281c0; --color-4: #93d6db; --color-5: #a4adb0. 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