#5C463B + #535049 + #446040 + #2B8B36 + #1FCC59 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#5C463B

Tangerine · DarkOliveGreen · Amber Brown

HEX

#5C463B

RGB

rgb(92, 70, 59)

HSL

hsl(20, 22%, 30%)

HSB

hsb(20, 36%, 36%)

CMYK

cmyk(0%, 24%, 36%, 64%)

Oklch

oklch(41.4% 0.035 47.9)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#535049

Ink Gray · DarkSlateGray · Charcoal

HEX

#535049

RGB

rgb(83, 80, 73)

HSL

hsl(42, 6%, 31%)

HSB

hsb(42, 12%, 33%)

CMYK

cmyk(0%, 4%, 12%, 67%)

Oklch

oklch(43.2% 0.012 87.5)

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

#446040

Celadon · DarkOliveGreen · Forest Green

HEX

#446040

RGB

rgb(68, 96, 64)

HSL

hsl(113, 20%, 31%)

HSB

hsb(113, 33%, 38%)

CMYK

cmyk(29%, 0%, 33%, 62%)

Oklch

oklch(45.7% 0.061 141.4)

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

#2B8B36

Pine Green · ForestGreen · Forest Green

HEX

#2B8B36

RGB

rgb(43, 139, 54)

HSL

hsl(127, 53%, 36%)

HSB

hsb(127, 69%, 55%)

CMYK

cmyk(69%, 0%, 61%, 45%)

Oklch

oklch(56.2% 0.151 145.0)

Traditional「Pine Green」· Paint「Forest Green」· Creative Blush Sunrise

#1FCC59

Pine Green · LimeGreen · Olive Green

HEX

#1FCC59

RGB

rgb(31, 204, 89)

HSL

hsl(140, 74%, 46%)

HSB

hsb(140, 85%, 80%)

CMYK

cmyk(85%, 0%, 56%, 20%)

Oklch

oklch(74.0% 0.205 148.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C463B

3C525D

Analogous

5D3C41

5C463B

5D583C

Triadic

5C463B

3C5D47

473C5D

Split-Comp.

5C463B

3C5D58

3C415D

Tetradic

5C463B

415D3C

3C525D

583C5D

Contrast Matrix WCAG 2.1 Contrast

5C463B	535049	446040	2B8B36	1FCC59
—	1.1 Fail	1.3 Fail	2.0 Fail	4.1 AA Large
1.1 Fail	—	1.1 Fail	1.9 Fail	3.8 AA Large
1.3 Fail	1.1 Fail	—	1.6 Fail	3.3 AA Large
2.0 Fail	1.9 Fail	1.6 Fail	—	2.0 Fail
4.1 AA Large	3.8 AA Large	3.3 AA Large	2.0 Fail	—

White BG

8.8AAA

8.0AAA

7.0AAA

4.3AA Large

2.1Fail

Black BG

2.4Fail

2.6Fail

3.0Fail

4.8AA

9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

52523E

52524B

505048

55554B

6A6B75

Deuteranopia

54553E

52524B

4F4C4A

4F4850

60537C

Tritanopia

5B4040

534C4C

454E4F

305B5E

288B90

Achromatopsia

4B4B4B

505050

545454

656565

8B8B8B

Shades & Tints Shades & Tints

#5C463B

Dark

Light

#535049

Dark

Light

#446040

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c463b;
  --color-2: #535049;
  --color-3: #446040;
  --color-4: #2b8b36;
  --color-5: #1fcc59;
}

SCSS

$color-1: #5c463b;
$color-2: #535049;
$color-3: #446040;
$color-4: #2b8b36;
$color-5: #1fcc59;

TAILWIND

colors: {
  'brand-1': '#5c463b',
  'brand-2': '#535049',
  'brand-3': '#446040',
  'brand-4': '#2b8b36',
  'brand-5': '#1fcc59',
}

RGB Array

[92, 70, 59], [83, 80, 73], [68, 96, 64], [43, 139, 54], [31, 204, 89]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5C463B, #535049, #446040, #2B8B36, #1FCC59 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: #5c463b; --color-2: #535049; --color-3: #446040; --color-4: #2b8b36; --color-5: #1fcc59. 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