← Back to Editor

#3CAB96 · #587060 · #634545 · #5C2020 · #28272B

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#3CAB96

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#3CAB96
RGB
rgb(60, 171, 150)
HSL
hsl(169, 48%, 45%)
HSB
hsb(169, 65%, 67%)
CMYK
cmyk(65%, 0%, 12%, 33%)
Oklch
oklch(67.3% 0.105 178.0)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#587060

Celadon · DimGray · Forest Green

HEX
#587060
RGB
rgb(88, 112, 96)
HSL
hsl(140, 12%, 39%)
HSB
hsb(140, 21%, 44%)
CMYK
cmyk(21%, 0%, 14%, 56%)
Oklch
oklch(52.1% 0.038 155.7)

TraditionalCeladon」· PaintForest Green」· Creative Blush Sunrise

#634545

Crimson · DarkOliveGreen · Wine Red

HEX
#634545
RGB
rgb(99, 69, 69)
HSL
hsl(0, 18%, 33%)
HSB
hsb(0, 30%, 39%)
CMYK
cmyk(0%, 30%, 30%, 61%)
Oklch
oklch(42.4% 0.042 18.9)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

#5C2020

Crimson · Maroon · Wine Red

HEX
#5C2020
RGB
rgb(92, 32, 32)
HSL
hsl(0, 48%, 24%)
HSB
hsb(0, 65%, 36%)
CMYK
cmyk(0%, 65%, 65%, 64%)
Oklch
oklch(33.5% 0.088 23.1)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

#28272B

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#28272B
RGB
rgb(40, 39, 43)
HSL
hsl(255, 5%, 16%)
HSB
hsb(255, 9%, 17%)
CMYK
cmyk(7%, 9%, 0%, 83%)
Oklch
oklch(27.5% 0.007 297.3)

TraditionalDark Cyan」· PaintDark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3CAB96
AA3C50

Analogous

3CAA5F
3CAB96
3C87AA

Triadic

3CAB96
963CAA
AA963C

Split-Comp.

3CAB96
AA3C87
AA5F3C

Tetradic

3CAB96
5F3CAA
AA3C50
87AA3C

Contrast Matrix WCAG 2.1 Contrast

3CAB96
587060
634545
5C2020
28272B
1.9
Fail
3.0
AA Large
4.4
AA Large
5.3
AA
1.9
Fail
1.6
Fail
2.3
Fail
2.8
Fail
3.0
AA Large
1.6
Fail
1.5
Fail
1.7
Fail
4.4
AA Large
2.3
Fail
1.5
Fail
1.2
Fail
5.3
AA
2.8
Fail
1.7
Fail
1.2
Fail
White BG
2.8Fail
5.4AA
8.5AAA
12.5AAA
14.8AAA
Black BG
7.5AAA
3.9AA Large
2.5Fail
1.7Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6C6D9B
626364
565645
424120
28282A

Deuteranopia

665D9C
615F65
585A45
464A20
28282A

Tritanopia

429FA0
596768
624545
592020
282929

Achromatopsia

878787
676767
4E4E4E
323232
282828

Shades & Tints Shades & Tints

#3CAB96

Dark
Light

#587060

Dark
Light

#634545

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3cab96;
  --color-2: #587060;
  --color-3: #634545;
  --color-4: #5c2020;
  --color-5: #28272b;
}

SCSS

$color-1: #3cab96;
$color-2: #587060;
$color-3: #634545;
$color-4: #5c2020;
$color-5: #28272b;

TAILWIND

colors: {
  'brand-1': '#3cab96',
  'brand-2': '#587060',
  'brand-3': '#634545',
  'brand-4': '#5c2020',
  'brand-5': '#28272b',
}

RGB Array

[60, 171, 150], [88, 112, 96], [99, 69, 69], [92, 32, 32], [40, 39, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3CAB96, #587060, #634545, #5C2020, #28272B is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #3cab96; --color-2: #587060; --color-3: #634545; --color-4: #5c2020; --color-5: #28272b. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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