#452B44 + #715337 + #9D7B2B + #C9A31E + #F5CB11 · luxury - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#452B44

Rose Purple · DarkSlateGray · Eggplant

HEX

#452B44

RGB

rgb(69, 43, 68)

HSL

hsl(302, 23%, 22%)

HSB

hsb(302, 38%, 27%)

CMYK

cmyk(0%, 38%, 1%, 73%)

Oklch

oklch(33.1% 0.055 328.1)

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

#715337

Tangerine · DarkOliveGreen · Amber Brown

HEX

#715337

RGB

rgb(113, 83, 55)

HSL

hsl(29, 35%, 33%)

HSB

hsb(29, 51%, 44%)

CMYK

cmyk(0%, 27%, 51%, 56%)

Oklch

oklch(46.7% 0.058 63.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#9D7B2B

Ochre · Sienna · Honey Gold

HEX

#9D7B2B

RGB

rgb(157, 123, 43)

HSL

hsl(42, 57%, 39%)

HSB

hsb(42, 73%, 62%)

CMYK

cmyk(0%, 22%, 73%, 38%)

Oklch

oklch(60.1% 0.105 85.1)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#C9A31E

Ochre · GoldenRod · Honey Gold

HEX

#C9A31E

RGB

rgb(201, 163, 30)

HSL

hsl(47, 74%, 45%)

HSB

hsb(47, 85%, 79%)

CMYK

cmyk(0%, 19%, 85%, 21%)

Oklch

oklch(73.0% 0.142 91.0)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#F5CB11

Ginger · Gold · Sunflower

HEX

#F5CB11

RGB

rgb(245, 203, 17)

HSL

hsl(49, 92%, 51%)

HSB

hsb(49, 93%, 96%)

CMYK

cmyk(0%, 17%, 93%, 4%)

Oklch

oklch(85.4% 0.173 93.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

452B44

2B452C

Analogous

392B45

452B44

452B37

Triadic

452B44

44452B

2B4445

Split-Comp.

452B44

37452B

2B4539

Tetradic

452B44

45392B

2B452C

2B3745

Contrast Matrix WCAG 2.1 Contrast

452B44	715337	9D7B2B	C9A31E	F5CB11
—	1.8 Fail	3.2 AA Large	5.2 AA	8.0 AAA
1.8 Fail	—	1.8 Fail	2.9 Fail	4.5 AA Large
3.2 AA Large	1.8 Fail	—	1.6 Fail	2.5 Fail
5.2 AA	2.9 Fail	1.6 Fail	—	1.5 Fail
8.0 AAA	4.5 AA Large	2.5 Fail	1.5 Fail	—

White BG

12.5AAA

7.0AAA

4.0AA Large

2.4Fail

1.6Fail

Black BG

1.7Fail

3.0Fail

5.3AA

8.7AAA

13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3A3A3E

64643E

8E8E3E

B9B83E

E3E23E

Deuteranopia

3B3D3C

66683F

909343

BBBE46

E5E849

Tritanopia

443938

704344

9B4E51

C7585D

F36269

Achromatopsia

363636

595959

7C7C7C

9F9F9F

C2C2C2

Shades & Tints Shades & Tints

#452B44

Dark

Light

#715337

Dark

Light

#9D7B2B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #452b44;
  --color-2: #715337;
  --color-3: #9d7b2b;
  --color-4: #c9a31e;
  --color-5: #f5cb11;
}

SCSS

$color-1: #452b44;
$color-2: #715337;
$color-3: #9d7b2b;
$color-4: #c9a31e;
$color-5: #f5cb11;

TAILWIND

colors: {
  'brand-1': '#452b44',
  'brand-2': '#715337',
  'brand-3': '#9d7b2b',
  'brand-4': '#c9a31e',
  'brand-5': '#f5cb11',
}

RGB Array

[69, 43, 68], [113, 83, 55], [157, 123, 43], [201, 163, 30], [245, 203, 17]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This luxury-style palette of #452B44, #715337, #9D7B2B, #C9A31E, #F5CB11 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: #452b44; --color-2: #715337; --color-3: #9d7b2b; --color-4: #c9a31e; --color-5: #f5cb11. 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 luxury-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