#322751 + #492D53 + #673057 + #7A364F + #9E3753 · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#322751

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#322751

RGB

rgb(50, 39, 81)

HSL

hsl(256, 35%, 24%)

HSB

hsb(256, 52%, 32%)

CMYK

cmyk(38%, 52%, 0%, 68%)

Oklch

oklch(30.7% 0.074 293.7)

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

#492D53

Dark Plum · DarkSlateGray · Eggplant

HEX

#492D53

RGB

rgb(73, 45, 83)

HSL

hsl(284, 30%, 25%)

HSB

hsb(284, 46%, 33%)

CMYK

cmyk(12%, 46%, 0%, 67%)

Oklch

oklch(34.8% 0.073 316.8)

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

#673057

Rose Purple · DimGray · Eggplant

HEX

#673057

RGB

rgb(103, 48, 87)

HSL

hsl(317, 36%, 30%)

HSB

hsb(317, 53%, 40%)

CMYK

cmyk(0%, 53%, 16%, 60%)

Oklch

oklch(39.7% 0.095 339.6)

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

#7A364F

Dark Violet · Brown · Camellia

HEX

#7A364F

RGB

rgb(122, 54, 79)

HSL

hsl(338, 39%, 35%)

HSB

hsb(338, 56%, 48%)

CMYK

cmyk(0%, 56%, 35%, 52%)

Oklch

oklch(43.2% 0.099 358.9)

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

#9E3753

Dark Violet · Brown · Camellia

HEX

#9E3753

RGB

rgb(158, 55, 83)

HSL

hsl(344, 48%, 42%)

HSB

hsb(344, 65%, 62%)

CMYK

cmyk(0%, 65%, 47%, 38%)

Oklch

oklch(49.1% 0.138 7.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

322751

475328

Analogous

283253

322751

492853

Triadic

322751

533328

285333

Split-Comp.

322751

534928

325328

Tetradic

322751

532832

475328

285349

Contrast Matrix WCAG 2.1 Contrast

322751	492D53	673057	7A364F	9E3753
—	1.2 Fail	1.4 Fail	1.6 Fail	2.0 Fail
1.2 Fail	—	1.2 Fail	1.4 Fail	1.8 Fail
1.4 Fail	1.2 Fail	—	1.2 Fail	1.5 Fail
1.6 Fail	1.4 Fail	1.2 Fail	—	1.3 Fail
2.0 Fail	1.8 Fail	1.5 Fail	1.3 Fail	—

White BG

13.6AAA

11.8AAA

9.8AAA

8.5AAA

6.7AA

Black BG

1.5Fail

1.8Fail

2.1Fail

2.5Fail

3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2D47

3D3D4A

4F4F4E

5D5C49

71704C

Deuteranopia

2E2F44

3F4148

52574B

616648

777F4B

Tritanopia

313F3D

484341

644644

774443

994746

Achromatopsia

2F2F2F

3A3A3A

454545

4D4D4D

595959

Shades & Tints Shades & Tints

#322751

Dark

Light

#492D53

Dark

Light

#673057

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #322751;
  --color-2: #492d53;
  --color-3: #673057;
  --color-4: #7a364f;
  --color-5: #9e3753;
}

SCSS

$color-1: #322751;
$color-2: #492d53;
$color-3: #673057;
$color-4: #7a364f;
$color-5: #9e3753;

TAILWIND

colors: {
  'brand-1': '#322751',
  'brand-2': '#492d53',
  'brand-3': '#673057',
  'brand-4': '#7a364f',
  'brand-5': '#9e3753',
}

RGB Array

[50, 39, 81], [73, 45, 83], [103, 48, 87], [122, 54, 79], [158, 55, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #322751, #492D53, #673057, #7A364F, #9E3753 is ideal for: tech websites, dark mode UIs, game UIs. 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: #322751; --color-2: #492d53; --color-3: #673057; --color-4: #7a364f; --color-5: #9e3753. 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. 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 sunset-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