← Back to Editor

#435847 · #B1B4AD · #EBE9DA · #2B1F1F · #BA2A2A

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

#435847

Celadon · DarkSlateGray · Forest Green

HEX
#435847
RGB
rgb(67, 88, 71)
HSL
hsl(131, 14%, 30%)
HSB
hsb(131, 24%, 35%)
CMYK
cmyk(24%, 0%, 19%, 65%)
Oklch
oklch(43.8% 0.038 150.3)

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

#B1B4AD

Ash · DarkGray · Silver Sand

HEX
#B1B4AD
RGB
rgb(177, 180, 173)
HSL
hsl(86, 4%, 69%)
HSB
hsb(86, 4%, 71%)
CMYK
cmyk(2%, 0%, 4%, 29%)
Oklch
oklch(76.5% 0.010 125.7)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#EBE9DA

Fresh Green · Beige · Lemon Cream

HEX
#EBE9DA
RGB
rgb(235, 233, 218)
HSL
hsl(53, 30%, 89%)
HSB
hsb(53, 7%, 92%)
CMYK
cmyk(0%, 1%, 7%, 8%)
Oklch
oklch(93.2% 0.020 100.6)

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

#2B1F1F

Crimson · Black · Deep Berry

HEX
#2B1F1F
RGB
rgb(43, 31, 31)
HSL
hsl(0, 16%, 15%)
HSB
hsb(0, 28%, 17%)
CMYK
cmyk(0%, 28%, 28%, 83%)
Oklch
oklch(25.4% 0.019 18.5)

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

#BA2A2A

Vermilion · FireBrick · Passion Red

HEX
#BA2A2A
RGB
rgb(186, 42, 42)
HSL
hsl(0, 63%, 45%)
HSB
hsb(0, 77%, 73%)
CMYK
cmyk(0%, 77%, 77%, 27%)
Oklch
oklch(51.9% 0.181 26.2)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

435847
574253

Analogous

495742
435847
425750

Triadic

435847
464257
574642

Split-Comp.

435847
504257
574249

Tetradic

435847
424957
574253
575042

Contrast Matrix WCAG 2.1 Contrast

435847
B1B4AD
EBE9DA
2B1F1F
BA2A2A
—
3.7
AA Large
6.3
AA
2.1
Fail
1.3
Fail
3.7
AA Large
—
1.7
Fail
7.6
AAA
2.9
Fail
6.3
AA
1.7
Fail
—
13.0
AAA
5.0
AA
2.1
Fail
7.6
AAA
13.0
AAA
—
2.6
Fail
1.3
Fail
2.9
Fail
5.0
AA
2.6
Fail
—
White BG
7.7AAA
2.1Fail
1.2Fail
15.9AAA
6.1AA
Black BG
2.7Fail
10.0AAA
17.2AAA
1.3Fail
3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4C4B
B2B2AF
EAEADE
26261F
7C7A2A

Deuteranopia

4B494C
B2B2AF
EAEADF
27271F
848F2A

Tritanopia

444E4F
B1B0B0
EBE0E1
2A1F1F
B32A2A

Achromatopsia

505050
B2B2B2
E8E8E8
232323
555555

Shades & Tints Shades & Tints

#435847

Dark
Light

#B1B4AD

Dark
Light

#EBE9DA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #435847;
  --color-2: #b1b4ad;
  --color-3: #ebe9da;
  --color-4: #2b1f1f;
  --color-5: #ba2a2a;
}

SCSS

$color-1: #435847;
$color-2: #b1b4ad;
$color-3: #ebe9da;
$color-4: #2b1f1f;
$color-5: #ba2a2a;

TAILWIND

colors: {
  'brand-1': '#435847',
  'brand-2': '#b1b4ad',
  'brand-3': '#ebe9da',
  'brand-4': '#2b1f1f',
  'brand-5': '#ba2a2a',
}

RGB Array

[67, 88, 71], [177, 180, 173], [235, 233, 218], [43, 31, 31], [186, 42, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #435847, #B1B4AD, #EBE9DA, #2B1F1F, #BA2A2A is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #435847; --color-2: #b1b4ad; --color-3: #ebe9da; --color-4: #2b1f1f; --color-5: #ba2a2a. 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. 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