← Back to Editor

#52534F · #71418F · #F6113B · #F99533 · #A39191

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

#52534F

Ink Gray · DarkSlateGray · Charcoal

HEX
#52534F
RGB
rgb(82, 83, 79)
HSL
hsl(75, 2%, 32%)
HSB
hsb(75, 5%, 33%)
CMYK
cmyk(1%, 0%, 5%, 67%)
Oklch
oklch(44.0% 0.007 118.1)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#71418F

Dark Plum · DarkSlateBlue · Violet

HEX
#71418F
RGB
rgb(113, 65, 143)
HSL
hsl(277, 38%, 41%)
HSB
hsb(277, 55%, 56%)
CMYK
cmyk(21%, 55%, 0%, 44%)
Oklch
oklch(46.8% 0.130 310.7)

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

#F6113B

Vermilion · Crimson · Passion Red

HEX
#F6113B
RGB
rgb(246, 17, 59)
HSL
hsl(349, 93%, 52%)
HSB
hsb(349, 93%, 96%)
CMYK
cmyk(0%, 93%, 76%, 4%)
Oklch
oklch(61.8% 0.244 22.0)

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

#F99533

Ginger · Coral · Warm Sun

HEX
#F99533
RGB
rgb(249, 149, 51)
HSL
hsl(30, 94%, 59%)
HSB
hsb(30, 80%, 98%)
CMYK
cmyk(0%, 40%, 80%, 2%)
Oklch
oklch(75.9% 0.160 59.9)

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

#A39191

Crimson · DarkGray · Silver Sand

HEX
#A39191
RGB
rgb(163, 145, 145)
HSL
hsl(0, 9%, 60%)
HSB
hsb(0, 11%, 64%)
CMYK
cmyk(0%, 11%, 11%, 36%)
Oklch
oklch(67.3% 0.022 17.7)

Traditional「Crimson」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

52534F
515053

Analogous

535250
52534F
515350

Triadic

52534F
505253
535052

Split-Comp.

52534F
505153
525053

Tetradic

52534F
505352
515053
535051

Contrast Matrix WCAG 2.1 Contrast

52534F
71418F
F6113B
F99533
A39191
—
1.1
Fail
1.9
Fail
3.5
AA Large
2.6
Fail
1.1
Fail
—
1.8
Fail
3.3
AA Large
2.5
Fail
1.9
Fail
1.8
Fail
—
1.9
Fail
1.4
Fail
3.5
AA Large
3.3
AA Large
1.9
Fail
—
1.3
Fail
2.6
Fail
2.5
Fail
1.4
Fail
1.3
Fail
—
White BG
7.8AAA
7.4AAA
4.1AA Large
2.2Fail
3.0Fail
Black BG
2.7Fail
2.9Fail
5.1AA
9.4AAA
7.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

525250
5C5C7C
939131
CECD4B
9B9B91

Deuteranopia

525250
5F6378
A0B12E
D4DB50
9C9E91

Tritanopia

525151
6F6D6A
EB2927
F45D62
A29191

Achromatopsia

525252
585858
5A5A5A
A8A8A8
969696

Shades & Tints Shades & Tints

#52534F

Dark
Light

#71418F

Dark
Light

#F6113B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #52534f;
  --color-2: #71418f;
  --color-3: #f6113b;
  --color-4: #f99533;
  --color-5: #a39191;
}

SCSS

$color-1: #52534f;
$color-2: #71418f;
$color-3: #f6113b;
$color-4: #f99533;
$color-5: #a39191;

TAILWIND

colors: {
  'brand-1': '#52534f',
  'brand-2': '#71418f',
  'brand-3': '#f6113b',
  'brand-4': '#f99533',
  'brand-5': '#a39191',
}

RGB Array

[82, 83, 79], [113, 65, 143], [246, 17, 59], [249, 149, 51], [163, 145, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #52534F, #71418F, #F6113B, #F99533, #A39191 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: #52534f; --color-2: #71418f; --color-3: #f6113b; --color-4: #f99533; --color-5: #a39191. 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