#3CB196 + #4A824B + #575300 + #4D3610 + #441920 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#3CB196

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#3CB196

RGB

rgb(60, 177, 150)

HSL

hsl(166, 49%, 46%)

HSB

hsb(166, 66%, 69%)

CMYK

cmyk(66%, 0%, 15%, 31%)

Oklch

oklch(68.8% 0.111 174.4)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#4A824B

Celadon · SeaGreen · Forest Green

HEX

#4A824B

RGB

rgb(74, 130, 75)

HSL

hsl(121, 27%, 40%)

HSB

hsb(121, 43%, 51%)

CMYK

cmyk(43%, 0%, 42%, 49%)

Oklch

oklch(55.3% 0.102 144.4)

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

#575300

Autumn Sage · DarkOliveGreen · Amber Gold

HEX

#575300

RGB

rgb(87, 83, 0)

HSL

hsl(57, 100%, 17%)

HSB

hsb(57, 100%, 34%)

CMYK

cmyk(0%, 5%, 100%, 66%)

Oklch

oklch(43.2% 0.092 106.5)

Traditional「Autumn Sage」· Paint「Amber Gold」· Creative Blush Sunrise

#4D3610

Ochre · DarkOliveGreen · Cinnamon

HEX

#4D3610

RGB

rgb(77, 54, 16)

HSL

hsl(37, 66%, 18%)

HSB

hsb(37, 79%, 30%)

CMYK

cmyk(0%, 30%, 79%, 70%)

Oklch

oklch(35.1% 0.062 76.5)

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

#441920

Crimson · Maroon · Deep Berry

HEX

#441920

RGB

rgb(68, 25, 32)

HSL

hsl(350, 46%, 18%)

HSB

hsb(350, 63%, 27%)

CMYK

cmyk(0%, 63%, 53%, 73%)

Oklch

oklch(28.1% 0.067 12.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3CB196

AF3C57

Analogous

3CAF5A

3CB196

3C90AF

Triadic

3CB196

943CAF

AF943C

Split-Comp.

3CB196

AF3C90

AF5A3C

Tetradic

3CB196

5A3CAF

AF3C57

90AF3C

Contrast Matrix WCAG 2.1 Contrast

3CB196	4A824B	575300	4D3610	441920
—	1.7 Fail	3.0 Fail	4.3 AA Large	5.6 AA
1.7 Fail	—	1.7 Fail	2.5 Fail	3.3 AA Large
3.0 Fail	1.7 Fail	—	1.4 Fail	1.9 Fail
4.3 AA Large	2.5 Fail	1.4 Fail	—	1.3 Fail
5.6 AA	3.3 AA Large	1.9 Fail	1.3 Fail	—

White BG

2.7Fail

4.6AA

7.9AAA

11.3AAA

14.9AAA

Black BG

7.9AAA

4.6AA

2.6Fail

1.9Fail

1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6F709D

626358

555514

434319

31311E

Deuteranopia

685F9E

5F5B5C

565619

44461B

34371E

Tritanopia

42A2A3

4D6365

572427

4C2022

421D1D

Achromatopsia

8B8B8B

6B6B6B

4B4B4B

393939

272727

Shades & Tints Shades & Tints

#3CB196

Dark

Light

#4A824B

Dark

Light

#575300

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3cb196;
  --color-2: #4a824b;
  --color-3: #575300;
  --color-4: #4d3610;
  --color-5: #441920;
}

SCSS

$color-1: #3cb196;
$color-2: #4a824b;
$color-3: #575300;
$color-4: #4d3610;
$color-5: #441920;

TAILWIND

colors: {
  'brand-1': '#3cb196',
  'brand-2': '#4a824b',
  'brand-3': '#575300',
  'brand-4': '#4d3610',
  'brand-5': '#441920',
}

RGB Array

[60, 177, 150], [74, 130, 75], [87, 83, 0], [77, 54, 16], [68, 25, 32]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3CB196, #4A824B, #575300, #4D3610, #441920 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: #3cb196; --color-2: #4a824b; --color-3: #575300; --color-4: #4d3610; --color-5: #441920. 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