← Back to Editor

#2B2421 · #4A372F · #61493F · #D9EBA9 · #ADD6A1

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#2B2421

Tangerine · DarkSlateGray · Cinnamon

HEX
#2B2421
RGB
rgb(43, 36, 33)
HSL
hsl(18, 13%, 15%)
HSB
hsb(18, 23%, 17%)
CMYK
cmyk(0%, 16%, 23%, 83%)
Oklch
oklch(26.7% 0.012 44.6)

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

#4A372F

Tangerine · DarkSlateGray · Cinnamon

HEX
#4A372F
RGB
rgb(74, 55, 47)
HSL
hsl(18, 22%, 24%)
HSB
hsb(18, 36%, 29%)
CMYK
cmyk(0%, 26%, 36%, 71%)
Oklch
oklch(35.6% 0.031 43.9)

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

#61493F

Tangerine · DarkOliveGreen · Amber Brown

HEX
#61493F
RGB
rgb(97, 73, 63)
HSL
hsl(18, 21%, 31%)
HSB
hsb(18, 35%, 38%)
CMYK
cmyk(0%, 25%, 35%, 62%)
Oklch
oklch(42.8% 0.037 43.7)

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

#D9EBA9

Willow Green · Wheat · Apple Green

HEX
#D9EBA9
RGB
rgb(217, 235, 169)
HSL
hsl(76, 62%, 79%)
HSB
hsb(76, 28%, 92%)
CMYK
cmyk(8%, 0%, 28%, 8%)
Oklch
oklch(91.1% 0.088 120.6)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#ADD6A1

Celadon · LightGreen · Apple Green

HEX
#ADD6A1
RGB
rgb(173, 214, 161)
HSL
hsl(106, 39%, 74%)
HSB
hsb(106, 25%, 84%)
CMYK
cmyk(19%, 0%, 25%, 16%)
Oklch
oklch(83.3% 0.084 138.7)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B2421
21282B

Analogous

2B2123
2B2421
2B2921

Triadic

2B2421
212B24
24212B

Split-Comp.

2B2421
212B29
21232B

Tetradic

2B2421
232B21
21282B
29212B

Contrast Matrix WCAG 2.1 Contrast

2B2421
4A372F
61493F
D9EBA9
ADD6A1
—
1.4
Fail
1.8
Fail
11.9
AAA
9.4
AAA
1.4
Fail
—
1.3
Fail
8.7
AAA
6.9
AA
1.8
Fail
1.3
Fail
—
6.5
AA
5.1
AA
11.9
AAA
8.7
AAA
6.5
AA
—
1.3
Fail
9.4
AAA
6.9
AA
5.1
AA
1.3
Fail
—
White BG
15.3AAA
11.2AAA
8.3AAA
1.3Fail
1.6Fail
Black BG
1.4Fail
1.9Fail
2.5Fail
16.4AAA
12.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

282822
424231
575641
E1E1B9
BFBFAE

Deuteranopia

282922
434431
585A42
E0DEBD
BCB9B1

Tritanopia

2B2222
493233
604344
DAC6C8
AFB8BA

Achromatopsia

262626
3C3C3C
4F4F4F
DEDEDE
C4C4C4

Shades & Tints Shades & Tints

#2B2421

Dark
Light

#4A372F

Dark
Light

#61493F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b2421;
  --color-2: #4a372f;
  --color-3: #61493f;
  --color-4: #d9eba9;
  --color-5: #add6a1;
}

SCSS

$color-1: #2b2421;
$color-2: #4a372f;
$color-3: #61493f;
$color-4: #d9eba9;
$color-5: #add6a1;

TAILWIND

colors: {
  'brand-1': '#2b2421',
  'brand-2': '#4a372f',
  'brand-3': '#61493f',
  'brand-4': '#d9eba9',
  'brand-5': '#add6a1',
}

RGB Array

[43, 36, 33], [74, 55, 47], [97, 73, 63], [217, 235, 169], [173, 214, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2B2421, #4A372F, #61493F, #D9EBA9, #ADD6A1 is ideal for: 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: #2b2421; --color-2: #4a372f; --color-3: #61493f; --color-4: #d9eba9; --color-5: #add6a1. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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