#9393A3 + #FD1D9A + #DB58A0 + #B3648F + #6D6D9C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#9393A3

Wisteria · DarkGray · Silver Sand

HEX

#9393A3

RGB

rgb(147, 147, 163)

HSL

hsl(240, 8%, 61%)

HSB

hsb(240, 10%, 64%)

CMYK

cmyk(10%, 10%, 0%, 36%)

Oklch

oklch(66.8% 0.023 285.7)

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

#FD1D9A

Rose Purple · DeepPink · Rose Pink

HEX

#FD1D9A

RGB

rgb(253, 29, 154)

HSL

hsl(327, 98%, 55%)

HSB

hsb(327, 89%, 99%)

CMYK

cmyk(0%, 89%, 39%, 1%)

Oklch

oklch(65.7% 0.259 354.7)

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

#DB58A0

Rose Purple · LightCoral · Rose Pink

HEX

#DB58A0

RGB

rgb(219, 88, 160)

HSL

hsl(327, 65%, 60%)

HSB

hsb(327, 60%, 86%)

CMYK

cmyk(0%, 60%, 27%, 14%)

Oklch

oklch(65.0% 0.180 349.2)

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

#B3648F

Rose Purple · Gray · Rose Pink

HEX

#B3648F

RGB

rgb(179, 100, 143)

HSL

hsl(327, 34%, 55%)

HSB

hsb(327, 44%, 70%)

CMYK

cmyk(0%, 44%, 20%, 30%)

Oklch

oklch(60.6% 0.114 347.2)

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

#6D6D9C

Deep Indigo · SlateGray · Navy Blue

HEX

#6D6D9C

RGB

rgb(109, 109, 156)

HSL

hsl(240, 19%, 52%)

HSB

hsb(240, 30%, 61%)

CMYK

cmyk(30%, 30%, 0%, 39%)

Oklch

oklch(55.4% 0.073 283.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9393A3

A4A494

Analogous

949CA4

9393A3

9C94A4

Triadic

9393A3

A49494

94A494

Split-Comp.

9393A3

A49C94

9CA494

Tetradic

9393A3

A4949C

A4A494

94A49C

Contrast Matrix WCAG 2.1 Contrast

9393A3	FD1D9A	DB58A0	B3648F	6D6D9C
—	1.2 Fail	1.2 Fail	1.4 Fail	1.6 Fail
1.2 Fail	—	1.0 Fail	1.1 Fail	1.3 Fail
1.2 Fail	1.0 Fail	—	1.2 Fail	1.4 Fail
1.4 Fail	1.1 Fail	1.2 Fail	—	1.2 Fail
1.6 Fail	1.3 Fail	1.4 Fail	1.2 Fail	—

White BG

3.0AA Large

3.6AA Large

3.5AA Large

4.1AA Large

4.9AA

Black BG

6.9AA

5.8AA

5.9AA

5.1AA

4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

93939F

9C9A7C

A2A18F

919085

6D6D91

Deuteranopia

93939E

A9BA75

AAB48A

959B82

6D6D8E

Tritanopia

939C9B

F2645F

D4817E

AF7C7B

6D8886

Achromatopsia

959595

6E6E6E

878787

818181

727272

Shades & Tints Shades & Tints

#9393A3

Dark

Light

#FD1D9A

Dark

Light

#DB58A0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9393a3;
  --color-2: #fd1d9a;
  --color-3: #db58a0;
  --color-4: #b3648f;
  --color-5: #6d6d9c;
}

SCSS

$color-1: #9393a3;
$color-2: #fd1d9a;
$color-3: #db58a0;
$color-4: #b3648f;
$color-5: #6d6d9c;

TAILWIND

colors: {
  'brand-1': '#9393a3',
  'brand-2': '#fd1d9a',
  'brand-3': '#db58a0',
  'brand-4': '#b3648f',
  'brand-5': '#6d6d9c',
}

RGB Array

[147, 147, 163], [253, 29, 154], [219, 88, 160], [179, 100, 143], [109, 109, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9393A3, #FD1D9A, #DB58A0, #B3648F, #6D6D9C 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: #9393a3; --color-2: #fd1d9a; --color-3: #db58a0; --color-4: #b3648f; --color-5: #6d6d9c. 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