← Back to Editor

#452B44 · #AD155F · #B0564D · #AB8F7D · #EED925

A 5-color palette palette · Complete color analysis and application guide

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

#AD155F

Dark Violet · MediumVioletRed · Camellia

HEX
#AD155F
RGB
rgb(173, 21, 95)
HSL
hsl(331, 78%, 38%)
HSB
hsb(331, 88%, 68%)
CMYK
cmyk(0%, 88%, 45%, 32%)
Oklch
oklch(49.3% 0.189 358.9)

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

#B0564D

Crimson · Sienna · Passion Red

HEX
#B0564D
RGB
rgb(176, 86, 77)
HSL
hsl(5, 39%, 50%)
HSB
hsb(5, 56%, 69%)
CMYK
cmyk(0%, 51%, 56%, 31%)
Oklch
oklch(56.1% 0.119 27.4)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#AB8F7D

Tangerine · Gray · Warm Sun

HEX
#AB8F7D
RGB
rgb(171, 143, 125)
HSL
hsl(23, 21%, 58%)
HSB
hsb(23, 27%, 67%)
CMYK
cmyk(0%, 16%, 27%, 33%)
Oklch
oklch(67.1% 0.043 54.6)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#EED925

Autumn Sage · Gold · Sunflower

HEX
#EED925
RGB
rgb(238, 217, 37)
HSL
hsl(54, 86%, 54%)
HSB
hsb(54, 84%, 93%)
CMYK
cmyk(0%, 9%, 84%, 7%)
Oklch
oklch(87.6% 0.176 102.0)

Traditional「Autumn Sage」· 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
AD155F
B0564D
AB8F7D
EED925
—
1.8
Fail
2.5
Fail
4.1
AA Large
8.7
AAA
1.8
Fail
—
1.4
Fail
2.3
Fail
4.8
AA
2.5
Fail
1.4
Fail
—
1.6
Fail
3.4
AA Large
4.1
AA Large
2.3
Fail
1.6
Fail
—
2.1
Fail
8.7
AAA
4.8
AA
3.4
AA Large
2.1
Fail
—
White BG
12.5AAA
6.9AA
4.9AA
3.0AA Large
1.4Fail
Black BG
1.7Fail
3.0AA Large
4.3AA Large
7.0AA
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3A3A3E
6B6A4D
89884F
9F9F81
E5E551

Deuteranopia

3B3D3C
747F49
8E9550
A1A382
E6E85B

Tritanopia

443938
A53F3C
AC5151
AA8586
ED737A

Achromatopsia

363636
4B4B4B
707070
959595
CBCBCB

Shades & Tints Shades & Tints

#452B44

Dark
Light

#AD155F

Dark
Light

#B0564D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #452b44;
  --color-2: #ad155f;
  --color-3: #b0564d;
  --color-4: #ab8f7d;
  --color-5: #eed925;
}

SCSS

$color-1: #452b44;
$color-2: #ad155f;
$color-3: #b0564d;
$color-4: #ab8f7d;
$color-5: #eed925;

TAILWIND

colors: {
  'brand-1': '#452b44',
  'brand-2': '#ad155f',
  'brand-3': '#b0564d',
  'brand-4': '#ab8f7d',
  'brand-5': '#eed925',
}

RGB Array

[69, 43, 68], [173, 21, 95], [176, 86, 77], [171, 143, 125], [238, 217, 37]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #452B44, #AD155F, #B0564D, #AB8F7D, #EED925 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: #452b44; --color-2: #ad155f; --color-3: #b0564d; --color-4: #ab8f7d; --color-5: #eed925. 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