← Back to Editor

#1B1D1C · #B1A5A9 · #E2994A · #D9C5A2 · #F5F3F6

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

#1B1D1C

Ink Black · Black · Dark Stone

HEX
#1B1D1C
RGB
rgb(27, 29, 28)
HSL
hsl(150, 4%, 11%)
HSB
hsb(150, 7%, 11%)
CMYK
cmyk(7%, 0%, 3%, 89%)
Oklch
oklch(22.8% 0.004 164.7)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

#B1A5A9

Ash · DarkGray · Silver Sand

HEX
#B1A5A9
RGB
rgb(177, 165, 169)
HSL
hsl(340, 7%, 67%)
HSB
hsb(340, 7%, 69%)
CMYK
cmyk(0%, 7%, 5%, 31%)
Oklch
oklch(73.3% 0.015 355.2)

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

#E2994A

Ginger · SandyBrown · Warm Sun

HEX
#E2994A
RGB
rgb(226, 153, 74)
HSL
hsl(31, 72%, 59%)
HSB
hsb(31, 67%, 89%)
CMYK
cmyk(0%, 32%, 67%, 11%)
Oklch
oklch(74.1% 0.129 65.5)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#D9C5A2

Goose Yellow · Tan · Warm Sun

HEX
#D9C5A2
RGB
rgb(217, 197, 162)
HSL
hsl(38, 42%, 74%)
HSB
hsb(38, 25%, 85%)
CMYK
cmyk(0%, 9%, 25%, 15%)
Oklch
oklch(83.1% 0.052 81.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#F5F3F6

Lilac · Snow · Lavender

HEX
#F5F3F6
RGB
rgb(245, 243, 246)
HSL
hsl(280, 14%, 96%)
HSB
hsb(280, 1%, 96%)
CMYK
cmyk(0%, 1%, 0%, 4%)
Oklch
oklch(96.7% 0.004 314.8)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1B1D1C
1D1B1C

Analogous

1B1D1B
1B1D1C
1B1D1D

Triadic

1B1D1C
1C1B1D
1D1C1B

Split-Comp.

1B1D1C
1D1B1D
1D1B1B

Tetradic

1B1D1C
1B1B1D
1D1B1C
1D1D1B

Contrast Matrix WCAG 2.1 Contrast

1B1D1C
B1A5A9
E2994A
D9C5A2
F5F3F6
—
7.1
AAA
7.2
AAA
10.1
AAA
15.4
AAA
7.1
AAA
—
1.0
Fail
1.4
Fail
2.2
Fail
7.2
AAA
1.0
Fail
—
1.4
Fail
2.1
Fail
10.1
AAA
1.4
Fail
1.4
Fail
—
1.5
Fail
15.4
AAA
2.2
Fail
2.1
Fail
1.5
Fail
—
White BG
16.9AAA
2.4Fail
2.4Fail
1.7Fail
1.1Fail
Black BG
1.2Fail
8.8AAA
8.9AAA
12.5AAA
19.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1C1C1C
ACACA8
C2C25D
D0D0AA
F4F4F5

Deuteranopia

1C1C1C
ADADA8
C7CC62
D2D3AD
F4F4F5

Tritanopia

1B1C1C
B0A7A7
DE6C70
D8B1B3
F5F5F5

Achromatopsia

1C1C1C
A9A9A9
A6A6A6
C7C7C7
F4F4F4

Shades & Tints Shades & Tints

#1B1D1C

Dark
Light

#B1A5A9

Dark
Light

#E2994A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1b1d1c;
  --color-2: #b1a5a9;
  --color-3: #e2994a;
  --color-4: #d9c5a2;
  --color-5: #f5f3f6;
}

SCSS

$color-1: #1b1d1c;
$color-2: #b1a5a9;
$color-3: #e2994a;
$color-4: #d9c5a2;
$color-5: #f5f3f6;

TAILWIND

colors: {
  'brand-1': '#1b1d1c',
  'brand-2': '#b1a5a9',
  'brand-3': '#e2994a',
  'brand-4': '#d9c5a2',
  'brand-5': '#f5f3f6',
}

RGB Array

[27, 29, 28], [177, 165, 169], [226, 153, 74], [217, 197, 162], [245, 243, 246]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1B1D1C, #B1A5A9, #E2994A, #D9C5A2, #F5F3F6 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: #1b1d1c; --color-2: #b1a5a9; --color-3: #e2994a; --color-4: #d9c5a2; --color-5: #f5f3f6. 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