← Back to Editor

#281626 · #6D3542 · #9F8B50 · #91A490 · #BEC1A4

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

#281626

Rose Purple · Black · Dark Purple

HEX
#281626
RGB
rgb(40, 22, 38)
HSL
hsl(307, 29%, 12%)
HSB
hsb(307, 45%, 16%)
CMYK
cmyk(0%, 45%, 5%, 84%)
Oklch
oklch(23.2% 0.040 330.8)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#6D3542

Crimson · Brown · Wine Red

HEX
#6D3542
RGB
rgb(109, 53, 66)
HSL
hsl(346, 35%, 32%)
HSB
hsb(346, 51%, 43%)
CMYK
cmyk(0%, 51%, 39%, 57%)
Oklch
oklch(40.6% 0.081 6.6)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#9F8B50

Ochre · Gray · Honey Gold

HEX
#9F8B50
RGB
rgb(159, 139, 80)
HSL
hsl(45, 33%, 47%)
HSB
hsb(45, 50%, 62%)
CMYK
cmyk(0%, 13%, 50%, 38%)
Oklch
oklch(64.2% 0.082 91.2)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#91A490

Celadon · DarkSeaGreen · Olive Green

HEX
#91A490
RGB
rgb(145, 164, 144)
HSL
hsl(117, 10%, 60%)
HSB
hsb(117, 12%, 64%)
CMYK
cmyk(12%, 0%, 12%, 36%)
Oklch
oklch(69.8% 0.036 143.8)

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

#BEC1A4

Fresh Green · Silver · Sunflower

HEX
#BEC1A4
RGB
rgb(190, 193, 164)
HSL
hsl(66, 19%, 70%)
HSB
hsb(66, 15%, 76%)
CMYK
cmyk(2%, 0%, 15%, 24%)
Oklch
oklch(80.1% 0.040 112.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

281626
162718

Analogous

211627
281626
27161D

Triadic

281626
252716
162527

Split-Comp.

281626
1D2716
162721

Tetradic

281626
272116
162718
161D27

Contrast Matrix WCAG 2.1 Contrast

281626
6D3542
9F8B50
91A490
BEC1A4
—
1.8
Fail
5.1
AA
6.4
AA
9.2
AAA
1.8
Fail
—
2.8
Fail
3.5
AA Large
5.1
AA
5.1
AA
2.8
Fail
—
1.3
Fail
1.8
Fail
6.4
AA
3.5
AA Large
1.3
Fail
—
1.4
Fail
9.2
AAA
5.1
AA
1.8
Fail
1.4
Fail
—
White BG
17.0AAA
9.4AAA
3.3AA Large
2.7Fail
1.8Fail
Black BG
1.2Fail
2.2Fail
6.3AA
7.9AAA
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

202022
55543F
96965E
999995
BFBFAB

Deuteranopia

212321
585C3E
989962
989796
BFBFAD

Tritanopia

271F1E
6A3C3C
9E6A6C
92999A
BEB1B2

Achromatopsia

1D1D1D
474747
8A8A8A
9C9C9C
BDBDBD

Shades & Tints Shades & Tints

#281626

Dark
Light

#6D3542

Dark
Light

#9F8B50

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #281626;
  --color-2: #6d3542;
  --color-3: #9f8b50;
  --color-4: #91a490;
  --color-5: #bec1a4;
}

SCSS

$color-1: #281626;
$color-2: #6d3542;
$color-3: #9f8b50;
$color-4: #91a490;
$color-5: #bec1a4;

TAILWIND

colors: {
  'brand-1': '#281626',
  'brand-2': '#6d3542',
  'brand-3': '#9f8b50',
  'brand-4': '#91a490',
  'brand-5': '#bec1a4',
}

RGB Array

[40, 22, 38], [109, 53, 66], [159, 139, 80], [145, 164, 144], [190, 193, 164]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #281626, #6D3542, #9F8B50, #91A490, #BEC1A4 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: #281626; --color-2: #6d3542; --color-3: #9f8b50; --color-4: #91a490; --color-5: #bec1a4. 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