← Back to Editor

#5C3952 · #F16359 · #E28E2C · #85BB9F · #839589

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

#5C3952

Rose Purple · DarkSlateGray · Eggplant

HEX
#5C3952
RGB
rgb(92, 57, 82)
HSL
hsl(317, 23%, 29%)
HSB
hsb(317, 38%, 36%)
CMYK
cmyk(0%, 38%, 11%, 64%)
Oklch
oklch(39.5% 0.062 337.9)

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

#F16359

Peach Pink · Tomato · Coral Red

HEX
#F16359
RGB
rgb(241, 99, 89)
HSL
hsl(4, 84%, 65%)
HSB
hsb(4, 63%, 95%)
CMYK
cmyk(0%, 59%, 63%, 5%)
Oklch
oklch(67.8% 0.177 26.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#E28E2C

Ginger · GoldenRod · Warm Sun

HEX
#E28E2C
RGB
rgb(226, 142, 44)
HSL
hsl(32, 76%, 53%)
HSB
hsb(32, 81%, 89%)
CMYK
cmyk(0%, 37%, 81%, 11%)
Oklch
oklch(71.8% 0.146 64.6)

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

#85BB9F

Celadon · DarkSeaGreen · Apple Green

HEX
#85BB9F
RGB
rgb(133, 187, 159)
HSL
hsl(149, 28%, 63%)
HSB
hsb(149, 29%, 73%)
CMYK
cmyk(29%, 0%, 15%, 27%)
Oklch
oklch(74.6% 0.070 161.5)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#839589

Celadon · Gray · Warm Gray

HEX
#839589
RGB
rgb(131, 149, 137)
HSL
hsl(140, 8%, 55%)
HSB
hsb(140, 12%, 58%)
CMYK
cmyk(12%, 0%, 8%, 42%)
Oklch
oklch(65.2% 0.027 156.4)

Traditional「Celadon」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C3952
395B43

Analogous

54395B
5C3952
5B3940

Triadic

5C3952
515B39
39515B

Split-Comp.

5C3952
405B39
395B54

Tetradic

5C3952
5B5439
395B43
39405B

Contrast Matrix WCAG 2.1 Contrast

5C3952
F16359
E28E2C
85BB9F
839589
—
3.1
AA Large
3.8
AA Large
4.4
AA Large
3.1
AA Large
3.1
AA Large
—
1.2
Fail
1.4
Fail
1.0
Fail
3.8
AA Large
1.2
Fail
—
1.2
Fail
1.2
Fail
4.4
AA Large
1.4
Fail
1.2
Fail
—
1.4
Fail
3.1
AA Large
1.0
Fail
1.2
Fail
1.4
Fail
—
White BG
9.7AAA
3.1AA Large
2.6Fail
2.2Fail
3.2AA Large
Black BG
2.2Fail
6.7AA
8.1AAA
9.6AAA
6.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4D4C
B4B25B
BEBD44
9C9DA6
8B8B8C

Deuteranopia

4F514B
BCC65C
C3C949
9995A7
8A888D

Tritanopia

5A4746
EA5D5E
DE565B
88ABAC
848E8F

Achromatopsia

464646
8C8C8C
9C9C9C
A8A8A8
8E8E8E

Shades & Tints Shades & Tints

#5C3952

Dark
Light

#F16359

Dark
Light

#E28E2C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c3952;
  --color-2: #f16359;
  --color-3: #e28e2c;
  --color-4: #85bb9f;
  --color-5: #839589;
}

SCSS

$color-1: #5c3952;
$color-2: #f16359;
$color-3: #e28e2c;
$color-4: #85bb9f;
$color-5: #839589;

TAILWIND

colors: {
  'brand-1': '#5c3952',
  'brand-2': '#f16359',
  'brand-3': '#e28e2c',
  'brand-4': '#85bb9f',
  'brand-5': '#839589',
}

RGB Array

[92, 57, 82], [241, 99, 89], [226, 142, 44], [133, 187, 159], [131, 149, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5C3952, #F16359, #E28E2C, #85BB9F, #839589 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: #5c3952; --color-2: #f16359; --color-3: #e28e2c; --color-4: #85bb9f; --color-5: #839589. 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