← Back to Editor

#368163 · #5C4F4C · #613F3E · #552219 · #0A0501

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

#368163

Mineral Blue · SeaGreen · Forest Green

HEX
#368163
RGB
rgb(54, 129, 99)
HSL
hsl(156, 41%, 36%)
HSB
hsb(156, 58%, 51%)
CMYK
cmyk(58%, 0%, 23%, 49%)
Oklch
oklch(54.7% 0.089 164.3)

Traditional「Mineral Blue」· Paint「Forest Green」· Creative Blush Sunrise

#5C4F4C

Crimson · DarkOliveGreen · Wine Red

HEX
#5C4F4C
RGB
rgb(92, 79, 76)
HSL
hsl(11, 10%, 33%)
HSB
hsb(11, 17%, 36%)
CMYK
cmyk(0%, 14%, 17%, 64%)
Oklch
oklch(44.0% 0.018 33.1)

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

#613F3E

Crimson · DarkOliveGreen · Wine Red

HEX
#613F3E
RGB
rgb(97, 63, 62)
HSL
hsl(2, 22%, 31%)
HSB
hsb(2, 36%, 38%)
CMYK
cmyk(0%, 35%, 36%, 62%)
Oklch
oklch(40.7% 0.048 21.2)

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

#552219

Crimson · Maroon · Wine Red

HEX
#552219
RGB
rgb(85, 34, 25)
HSL
hsl(9, 55%, 22%)
HSB
hsb(9, 71%, 33%)
CMYK
cmyk(0%, 60%, 71%, 67%)
Oklch
oklch(32.4% 0.078 31.8)

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

#0A0501

Tangerine · Black · Cinnamon

HEX
#0A0501
RGB
rgb(10, 5, 1)
HSL
hsl(27, 82%, 2%)
HSB
hsb(27, 90%, 4%)
CMYK
cmyk(0%, 50%, 90%, 96%)
Oklch
oklch(12.1% 0.020 74.1)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

368163
813654

Analogous

36813E
368163
367A81

Triadic

368163
633681
816336

Split-Comp.

368163
81367A
813E36

Tetradic

368163
3E3681
813654
7A8136

Contrast Matrix WCAG 2.1 Contrast

368163
5C4F4C
613F3E
552219
0A0501
—
1.7
Fail
2.0
Fail
2.7
Fail
4.3
AA Large
1.7
Fail
—
1.2
Fail
1.6
Fail
2.6
Fail
2.0
Fail
1.2
Fail
—
1.4
Fail
2.2
Fail
2.7
Fail
1.6
Fail
1.4
Fail
—
1.6
Fail
4.3
AA Large
2.6
Fail
2.2
Fail
1.6
Fail
—
White BG
4.7AA
7.8AAA
9.2AAA
12.9AAA
20.3AAA
Black BG
4.5AA Large
2.7Fail
2.3Fail
1.6Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

56576A
56564D
52523E
3F3E1B
080802

Deuteranopia

524D6C
57584D
54573E
42461C
080902

Tritanopia

3A7071
5B4D4D
5F3E3E
521D1D
0A0303

Achromatopsia

676767
535353
494949
303030
060606

Shades & Tints Shades & Tints

#368163

Dark
Light

#5C4F4C

Dark
Light

#613F3E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #368163;
  --color-2: #5c4f4c;
  --color-3: #613f3e;
  --color-4: #552219;
  --color-5: #0a0501;
}

SCSS

$color-1: #368163;
$color-2: #5c4f4c;
$color-3: #613f3e;
$color-4: #552219;
$color-5: #0a0501;

TAILWIND

colors: {
  'brand-1': '#368163',
  'brand-2': '#5c4f4c',
  'brand-3': '#613f3e',
  'brand-4': '#552219',
  'brand-5': '#0a0501',
}

RGB Array

[54, 129, 99], [92, 79, 76], [97, 63, 62], [85, 34, 25], [10, 5, 1]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #368163, #5C4F4C, #613F3E, #552219, #0A0501 is ideal for: tech websites, dark mode UIs, game UIs. 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: #368163; --color-2: #5c4f4c; --color-3: #613f3e; --color-4: #552219; --color-5: #0a0501. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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