← Back to Editor

#B3A479 · #6C5B3F · #141416 · #F1F2F4 · #9B1627

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

#B3A479

Ginger · Tan · Sunflower

HEX
#B3A479
RGB
rgb(179, 164, 121)
HSL
hsl(44, 28%, 59%)
HSB
hsb(44, 32%, 70%)
CMYK
cmyk(0%, 8%, 32%, 30%)
Oklch
oklch(72.1% 0.061 91.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#6C5B3F

Ochre · DarkOliveGreen · Amber Brown

HEX
#6C5B3F
RGB
rgb(108, 91, 63)
HSL
hsl(37, 26%, 34%)
HSB
hsb(37, 42%, 42%)
CMYK
cmyk(0%, 16%, 42%, 58%)
Oklch
oklch(48.1% 0.047 79.7)

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

#141416

Ink Black · Black · Jet Black

HEX
#141416
RGB
rgb(20, 20, 22)
HSL
hsl(240, 5%, 8%)
HSB
hsb(240, 9%, 9%)
CMYK
cmyk(9%, 9%, 0%, 91%)
Oklch
oklch(19.2% 0.004 286.0)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

#F1F2F4

Azure · SeaShell · Sky Blue

HEX
#F1F2F4
RGB
rgb(241, 242, 244)
HSL
hsl(220, 12%, 95%)
HSB
hsb(220, 1%, 96%)
CMYK
cmyk(1%, 1%, 0%, 4%)
Oklch
oklch(96.1% 0.003 264.5)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#9B1627

Vermilion · Brown · Wine Red

HEX
#9B1627
RGB
rgb(155, 22, 39)
HSL
hsl(352, 75%, 35%)
HSB
hsb(352, 86%, 61%)
CMYK
cmyk(0%, 86%, 75%, 39%)
Oklch
oklch(44.6% 0.165 21.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3A479
7989B4

Analogous

B48779
B3A479
A6B479

Triadic

B3A479
79B4A4
A479B4

Split-Comp.

B3A479
79A6B4
8779B4

Tetradic

B3A479
79B487
7989B4
B479A6

Contrast Matrix WCAG 2.1 Contrast

B3A479
6C5B3F
141416
F1F2F4
9B1627
—
2.7
Fail
7.4
AAA
2.2
Fail
3.4
AA Large
2.7
Fail
—
2.8
Fail
5.8
AA
1.3
Fail
7.4
AAA
2.8
Fail
—
16.4
AAA
2.2
Fail
2.2
Fail
5.8
AA
16.4
AAA
—
7.4
AAA
3.4
AA Large
1.3
Fail
2.2
Fail
7.4
AAA
—
White BG
2.5Fail
6.6AA
18.4AAA
1.1Fail
8.3AAA
Black BG
8.5AAA
3.2AA Large
1.1Fail
18.7AAA
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

ADAC83
656446
141416
F1F1F4
616023

Deuteranopia

ADAF86
666747
141415
F1F1F3
697322

Tritanopia

B28C8D
6B4B4C
141515
F1F3F3
94201F

Achromatopsia

A4A4A4
5D5D5D
141414
F2F2F2
404040

Shades & Tints Shades & Tints

#B3A479

Dark
Light

#6C5B3F

Dark
Light

#141416

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3a479;
  --color-2: #6c5b3f;
  --color-3: #141416;
  --color-4: #f1f2f4;
  --color-5: #9b1627;
}

SCSS

$color-1: #b3a479;
$color-2: #6c5b3f;
$color-3: #141416;
$color-4: #f1f2f4;
$color-5: #9b1627;

TAILWIND

colors: {
  'brand-1': '#b3a479',
  'brand-2': '#6c5b3f',
  'brand-3': '#141416',
  'brand-4': '#f1f2f4',
  'brand-5': '#9b1627',
}

RGB Array

[179, 164, 121], [108, 91, 63], [20, 20, 22], [241, 242, 244], [155, 22, 39]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3A479, #6C5B3F, #141416, #F1F2F4, #9B1627 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: #b3a479; --color-2: #6c5b3f; --color-3: #141416; --color-4: #f1f2f4; --color-5: #9b1627. 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