#3D5F91 + #5A5887 + #765D8C + #798F00 + #FF007B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3D5F91

Indigo · DarkSlateBlue · Prussian Blue

HEX

#3D5F91

RGB

rgb(61, 95, 145)

HSL

hsl(216, 41%, 40%)

HSB

hsb(216, 58%, 57%)

CMYK

cmyk(58%, 34%, 0%, 43%)

Oklch

oklch(48.3% 0.090 257.9)

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

#5A5887

Deep Indigo · DarkSlateBlue · Navy Blue

HEX

#5A5887

RGB

rgb(90, 88, 135)

HSL

hsl(243, 21%, 44%)

HSB

hsb(243, 35%, 53%)

CMYK

cmyk(33%, 35%, 0%, 47%)

Oklch

oklch(48.2% 0.075 285.2)

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

#765D8C

Dark Plum · SlateGray · Violet

HEX

#765D8C

RGB

rgb(118, 93, 140)

HSL

hsl(272, 20%, 46%)

HSB

hsb(272, 34%, 55%)

CMYK

cmyk(16%, 34%, 0%, 45%)

Oklch

oklch(52.2% 0.078 308.2)

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

#798F00

Autumn Sage · Olive · Honey Gold

HEX

#798F00

RGB

rgb(121, 143, 0)

HSL

hsl(69, 100%, 28%)

HSB

hsb(69, 100%, 56%)

CMYK

cmyk(15%, 0%, 100%, 44%)

Oklch

oklch(61.1% 0.145 120.0)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#FF007B

Dark Violet · DeepPink · Camellia

HEX

#FF007B

RGB

rgb(255, 0, 123)

HSL

hsl(331, 100%, 50%)

HSB

hsb(331, 100%, 100%)

CMYK

cmyk(0%, 100%, 52%, 0%)

Oklch

oklch(64.4% 0.259 4.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D5F91

906E3C

Analogous

3C8790

3D5F91

453C90

Triadic

3D5F91

903C5E

5E903C

Split-Comp.

3D5F91

90453C

87903C

Tetradic

3D5F91

903C87

906E3C

3C9045

Contrast Matrix WCAG 2.1 Contrast

3D5F91	5A5887	765D8C	798F00	FF007B
—	1.0 Fail	1.1 Fail	1.8 Fail	1.7 Fail
1.0 Fail	—	1.2 Fail	1.8 Fail	1.7 Fail
1.1 Fail	1.2 Fail	—	1.5 Fail	1.5 Fail
1.8 Fail	1.8 Fail	1.5 Fail	—	1.0 Fail
1.7 Fail	1.7 Fail	1.5 Fail	1.0 Fail	—

White BG

6.5AA

6.6AA

5.7AA

3.7AA Large

3.8AA Large

Black BG

3.2AA Large

3.7AA Large

5.7AA

5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4C85

59597C

6B6B81

838323

918E5D

Deuteranopia

4A4782

595979

6D6F7E

81802B

9FB356

Tritanopia

3F7B79

5A7371

757876

7A3E44

F24641

Achromatopsia

5B5B5B

5E5E5E

6A6A6A

787878

5A5A5A

Shades & Tints Shades & Tints

#3D5F91

Dark

Light

#5A5887

Dark

Light

#765D8C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d5f91;
  --color-2: #5a5887;
  --color-3: #765d8c;
  --color-4: #798f00;
  --color-5: #ff007b;
}

SCSS

$color-1: #3d5f91;
$color-2: #5a5887;
$color-3: #765d8c;
$color-4: #798f00;
$color-5: #ff007b;

TAILWIND

colors: {
  'brand-1': '#3d5f91',
  'brand-2': '#5a5887',
  'brand-3': '#765d8c',
  'brand-4': '#798f00',
  'brand-5': '#ff007b',
}

RGB Array

[61, 95, 145], [90, 88, 135], [118, 93, 140], [121, 143, 0], [255, 0, 123]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3D5F91, #5A5887, #765D8C, #798F00, #FF007B 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: #3d5f91; --color-2: #5a5887; --color-3: #765d8c; --color-4: #798f00; --color-5: #ff007b. 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