← Back to Editor

#212601 · #515E04 · #F1F4CB · #3FA997 · #1B5148

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#212601

Autumn Sage · Black · Amber Gold

HEX
#212601
RGB
rgb(33, 38, 1)
HSL
hsl(68, 95%, 8%)
HSB
hsb(68, 97%, 15%)
CMYK
cmyk(13%, 0%, 97%, 85%)
Oklch
oklch(25.5% 0.057 117.1)

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

#515E04

Autumn Sage · DarkOliveGreen · Amber Gold

HEX
#515E04
RGB
rgb(81, 94, 4)
HSL
hsl(69, 92%, 19%)
HSB
hsb(69, 96%, 37%)
CMYK
cmyk(14%, 0%, 96%, 63%)
Oklch
oklch(45.5% 0.105 118.7)

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

#F1F4CB

Fresh Green · Beige · Lemon Cream

HEX
#F1F4CB
RGB
rgb(241, 244, 203)
HSL
hsl(64, 65%, 88%)
HSB
hsb(64, 17%, 96%)
CMYK
cmyk(1%, 0%, 17%, 4%)
Oklch
oklch(95.4% 0.054 110.8)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#3FA997

Mineral Blue · CadetBlue · Mint Ice

HEX
#3FA997
RGB
rgb(63, 169, 151)
HSL
hsl(170, 46%, 45%)
HSB
hsb(170, 63%, 66%)
CMYK
cmyk(63%, 0%, 11%, 34%)
Oklch
oklch(66.9% 0.100 179.8)

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

#1B5148

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#1B5148
RGB
rgb(27, 81, 72)
HSL
hsl(170, 50%, 21%)
HSB
hsb(170, 67%, 32%)
CMYK
cmyk(67%, 0%, 11%, 68%)
Oklch
oklch(39.6% 0.059 180.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

212601
060128

Analogous

281A01
212601
0F2801

Triadic

212601
012328
280123

Split-Comp.

212601
010F28
1A0128

Tetradic

212601
01281A
060128
28010F

Contrast Matrix WCAG 2.1 Contrast

212601
515E04
F1F4CB
3FA997
1B5148
—
2.2
Fail
13.8
AAA
5.5
AA
1.7
Fail
2.2
Fail
—
6.3
AA
2.5
Fail
1.3
Fail
13.8
AAA
6.3
AA
—
2.5
Fail
8.0
AAA
5.5
AA
2.5
Fail
2.5
Fail
—
3.2
AA Large
1.7
Fail
1.3
Fail
8.0
AAA
3.2
AA Large
—
White BG
15.6AAA
7.1AAA
1.1Fail
2.9Fail
9.1AAA
Black BG
1.3Fail
3.0Fail
18.5AAA
7.3AAA
2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

23230A
57571A
F2F2D5
6D6E9B
32334A

Deuteranopia

23230C
56551F
F2F2D7
675F9C
2F2B4B

Tritanopia

211113
522B2F
F1DDDE
449FA0
1E4C4C

Achromatopsia

202020
505050
EEEEEE
878787
404040

Shades & Tints Shades & Tints

#212601

Dark
Light

#515E04

Dark
Light

#F1F4CB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #212601;
  --color-2: #515e04;
  --color-3: #f1f4cb;
  --color-4: #3fa997;
  --color-5: #1b5148;
}

SCSS

$color-1: #212601;
$color-2: #515e04;
$color-3: #f1f4cb;
$color-4: #3fa997;
$color-5: #1b5148;

TAILWIND

colors: {
  'brand-1': '#212601',
  'brand-2': '#515e04',
  'brand-3': '#f1f4cb',
  'brand-4': '#3fa997',
  'brand-5': '#1b5148',
}

RGB Array

[33, 38, 1], [81, 94, 4], [241, 244, 203], [63, 169, 151], [27, 81, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #212601, #515E04, #F1F4CB, #3FA997, #1B5148 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #212601; --color-2: #515e04; --color-3: #f1f4cb; --color-4: #3fa997; --color-5: #1b5148. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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