← Back to Editor

#212015 · #59653B · #699157 · #5EB87B · #1FE0A1

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

#212015

Autumn Sage · Black · Amber Gold

HEX
#212015
RGB
rgb(33, 32, 21)
HSL
hsl(55, 22%, 11%)
HSB
hsb(55, 36%, 13%)
CMYK
cmyk(0%, 3%, 36%, 87%)
Oklch
oklch(24.1% 0.020 103.4)

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

#59653B

Grass Green · DarkOliveGreen · Forest Green

HEX
#59653B
RGB
rgb(89, 101, 59)
HSL
hsl(77, 26%, 31%)
HSB
hsb(77, 42%, 40%)
CMYK
cmyk(12%, 0%, 42%, 60%)
Oklch
oklch(48.5% 0.064 121.8)

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

#699157

Celadon · DimGray · Olive Green

HEX
#699157
RGB
rgb(105, 145, 87)
HSL
hsl(101, 25%, 45%)
HSB
hsb(101, 40%, 57%)
CMYK
cmyk(28%, 0%, 40%, 43%)
Oklch
oklch(61.2% 0.095 136.4)

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

#5EB87B

Celadon · MediumSeaGreen · Olive Green

HEX
#5EB87B
RGB
rgb(94, 184, 123)
HSL
hsl(139, 39%, 55%)
HSB
hsb(139, 49%, 72%)
CMYK
cmyk(49%, 0%, 33%, 28%)
Oklch
oklch(71.1% 0.125 152.5)

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

#1FE0A1

Mineral Blue · MediumSpringGreen · Mint Ice

HEX
#1FE0A1
RGB
rgb(31, 224, 161)
HSL
hsl(160, 76%, 50%)
HSB
hsb(160, 86%, 88%)
CMYK
cmyk(86%, 0%, 28%, 12%)
Oklch
oklch(80.5% 0.168 163.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

212015
161722

Analogous

221B16
212015
1D2216

Triadic

212015
162221
211622

Split-Comp.

212015
161D22
1B1622

Tetradic

212015
16221B
161722
22161D

Contrast Matrix WCAG 2.1 Contrast

212015
59653B
699157
5EB87B
1FE0A1
—
2.6
Fail
4.5
AA
6.7
AA
9.5
AAA
2.6
Fail
—
1.7
Fail
2.6
Fail
3.7
AA Large
4.5
AA
1.7
Fail
—
1.5
Fail
2.1
Fail
6.7
AA
2.6
Fail
1.5
Fail
—
1.4
Fail
9.5
AAA
3.7
AA Large
2.1
Fail
1.4
Fail
—
White BG
16.4AAA
6.3AA
3.6AA Large
2.4Fail
1.7Fail
Black BG
1.3Fail
3.3AA Large
5.8AA
8.6AAA
12.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

212118
5E5E45
7A7B65
85868A
7374B0

Deuteranopia

212118
5E5D48
787568
80798D
6759B4

Tritanopia

211A1A
5A4D4F
6B7073
639598
29BCBF

Achromatopsia

1F1F1F
5D5D5D
7E7E7E
969696
9F9F9F

Shades & Tints Shades & Tints

#212015

Dark
Light

#59653B

Dark
Light

#699157

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #212015;
  --color-2: #59653b;
  --color-3: #699157;
  --color-4: #5eb87b;
  --color-5: #1fe0a1;
}

SCSS

$color-1: #212015;
$color-2: #59653b;
$color-3: #699157;
$color-4: #5eb87b;
$color-5: #1fe0a1;

TAILWIND

colors: {
  'brand-1': '#212015',
  'brand-2': '#59653b',
  'brand-3': '#699157',
  'brand-4': '#5eb87b',
  'brand-5': '#1fe0a1',
}

RGB Array

[33, 32, 21], [89, 101, 59], [105, 145, 87], [94, 184, 123], [31, 224, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #212015, #59653B, #699157, #5EB87B, #1FE0A1 is ideal for: tech websites, dark mode UIs, game UIs, 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: #212015; --color-2: #59653b; --color-3: #699157; --color-4: #5eb87b; --color-5: #1fe0a1. 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. 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