← Back to Editor

#352323 · #474E58 · #5D8A63 · #C3C74E · #E3EA80

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 LibraryData Visualization

Color Details Color Details

#352323

Crimson · DarkSlateGray · Deep Berry

HEX
#352323
RGB
rgb(53, 35, 35)
HSL
hsl(0, 20%, 17%)
HSB
hsb(0, 34%, 21%)
CMYK
cmyk(0%, 34%, 34%, 79%)
Oklch
oklch(27.8% 0.028 19.0)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#474E58

Indigo · DarkSlateGray · Prussian Blue

HEX
#474E58
RGB
rgb(71, 78, 88)
HSL
hsl(215, 11%, 31%)
HSB
hsb(215, 19%, 35%)
CMYK
cmyk(19%, 11%, 0%, 65%)
Oklch
oklch(42.1% 0.019 257.3)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#5D8A63

Celadon · DimGray · Olive Green

HEX
#5D8A63
RGB
rgb(93, 138, 99)
HSL
hsl(128, 19%, 45%)
HSB
hsb(128, 33%, 54%)
CMYK
cmyk(33%, 0%, 28%, 46%)
Oklch
oklch(59.0% 0.077 147.9)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#C3C74E

Autumn Sage · GoldenRod · Sunflower

HEX
#C3C74E
RGB
rgb(195, 199, 78)
HSL
hsl(62, 52%, 54%)
HSB
hsb(62, 61%, 78%)
CMYK
cmyk(2%, 0%, 61%, 22%)
Oklch
oklch(80.3% 0.143 111.0)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#E3EA80

Fresh Green · Khaki · Sunflower

HEX
#E3EA80
RGB
rgb(227, 234, 128)
HSL
hsl(64, 72%, 71%)
HSB
hsb(64, 45%, 92%)
CMYK
cmyk(3%, 0%, 45%, 8%)
Oklch
oklch(91.0% 0.130 112.0)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

352323
233434

Analogous

34232B
352323
342B23

Triadic

352323
233423
232334

Split-Comp.

352323
23342B
232B34

Tetradic

352323
2B3423
233434
2B2334

Contrast Matrix WCAG 2.1 Contrast

352323
474E58
5D8A63
C3C74E
E3EA80
—
1.8
Fail
3.7
AA Large
8.2
AAA
11.5
AAA
1.8
Fail
—
2.1
Fail
4.6
AA
6.5
AA
3.7
AA Large
2.1
Fail
—
2.2
Fail
3.1
AA Large
8.2
AAA
4.6
AA
2.2
Fail
—
1.4
Fail
11.5
AAA
6.5
AA
3.1
AA Large
1.4
Fail
—
White BG
14.8AAA
8.4AAA
4.0AA Large
1.8Fail
1.3Fail
Black BG
1.4Fail
2.5Fail
5.3AA
11.6AAA
16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2D2D23
4A4A56
70716C
C5C56B
E6E69A

Deuteranopia

2E3023
4A4955
6E6B6F
C5C472
E6E5A0

Tritanopia

342323
475453
5F7476
C38287
E3AEB2

Achromatopsia

282828
4D4D4D
787878
B8B8B8
DCDCDC

Shades & Tints Shades & Tints

#352323

Dark
Light

#474E58

Dark
Light

#5D8A63

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #352323;
  --color-2: #474e58;
  --color-3: #5d8a63;
  --color-4: #c3c74e;
  --color-5: #e3ea80;
}

SCSS

$color-1: #352323;
$color-2: #474e58;
$color-3: #5d8a63;
$color-4: #c3c74e;
$color-5: #e3ea80;

TAILWIND

colors: {
  'brand-1': '#352323',
  'brand-2': '#474e58',
  'brand-3': '#5d8a63',
  'brand-4': '#c3c74e',
  'brand-5': '#e3ea80',
}

RGB Array

[53, 35, 35], [71, 78, 88], [93, 138, 99], [195, 199, 78], [227, 234, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #352323, #474E58, #5D8A63, #C3C74E, #E3EA80 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #352323; --color-2: #474e58; --color-3: #5d8a63; --color-4: #c3c74e; --color-5: #e3ea80. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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