← Back to Editor

#523343 · #73495F · #C45855 · #EEC752 · #899C96

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#523343

Rose Purple · DarkSlateGray · Camellia

HEX
#523343
RGB
rgb(82, 51, 67)
HSL
hsl(329, 23%, 26%)
HSB
hsb(329, 38%, 32%)
CMYK
cmyk(0%, 38%, 18%, 68%)
Oklch
oklch(36.4% 0.051 347.6)

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

#73495F

Rose Purple · DimGray · Camellia

HEX
#73495F
RGB
rgb(115, 73, 95)
HSL
hsl(329, 22%, 37%)
HSB
hsb(329, 37%, 45%)
CMYK
cmyk(0%, 37%, 17%, 55%)
Oklch
oklch(46.0% 0.065 347.3)

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

#C45855

Crimson · Sienna · Passion Red

HEX
#C45855
RGB
rgb(196, 88, 85)
HSL
hsl(2, 48%, 55%)
HSB
hsb(2, 57%, 77%)
CMYK
cmyk(0%, 55%, 57%, 23%)
Oklch
oklch(59.5% 0.139 23.8)

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

#EEC752

Ginger · SandyBrown · Sunflower

HEX
#EEC752
RGB
rgb(238, 199, 82)
HSL
hsl(45, 82%, 63%)
HSB
hsb(45, 66%, 93%)
CMYK
cmyk(0%, 16%, 66%, 7%)
Oklch
oklch(84.2% 0.140 90.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#899C96

Mineral Blue · LightSlateGray · Silver Sand

HEX
#899C96
RGB
rgb(137, 156, 150)
HSL
hsl(161, 9%, 57%)
HSB
hsb(161, 12%, 61%)
CMYK
cmyk(12%, 0%, 4%, 39%)
Oklch
oklch(67.6% 0.023 174.6)

Traditional「Mineral Blue」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

523343
335242

Analogous

513352
523343
523334

Triadic

523343
435233
334352

Split-Comp.

523343
345233
335251

Tetradic

523343
525133
335242
333452

Contrast Matrix WCAG 2.1 Contrast

523343
73495F
C45855
EEC752
899C96
—
1.5
Fail
2.5
Fail
6.8
AA
3.8
AA Large
1.5
Fail
—
1.7
Fail
4.5
AA
2.5
Fail
2.5
Fail
1.7
Fail
—
2.7
Fail
1.5
Fail
6.8
AA
4.5
AA
2.7
Fail
—
1.8
Fail
3.8
AA Large
2.5
Fail
1.5
Fail
1.8
Fail
—
White BG
11.0AAA
7.4AAA
4.3AA Large
1.6Fail
2.9Fail
Black BG
1.9Fail
2.8Fail
4.9AA
12.9AAA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

45443F
61605A
959456
DDDD6E
919197

Deuteranopia

46493E
636658
9CA456
DFE275
908F98

Tritanopia

503C3B
715555
BF5656
EC858A
8A9999

Achromatopsia

3E3E3E
585858
787878
C5C5C5
969696

Shades & Tints Shades & Tints

#523343

Dark
Light

#73495F

Dark
Light

#C45855

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #523343;
  --color-2: #73495f;
  --color-3: #c45855;
  --color-4: #eec752;
  --color-5: #899c96;
}

SCSS

$color-1: #523343;
$color-2: #73495f;
$color-3: #c45855;
$color-4: #eec752;
$color-5: #899c96;

TAILWIND

colors: {
  'brand-1': '#523343',
  'brand-2': '#73495f',
  'brand-3': '#c45855',
  'brand-4': '#eec752',
  'brand-5': '#899c96',
}

RGB Array

[82, 51, 67], [115, 73, 95], [196, 88, 85], [238, 199, 82], [137, 156, 150]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #523343, #73495F, #C45855, #EEC752, #899C96 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: #523343; --color-2: #73495f; --color-3: #c45855; --color-4: #eec752; --color-5: #899c96. 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