← Back to Editor

#1A1416 · #3D2731 · #8F566E · #AD93AE · #F1D3C9

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

#1A1416

Dark Violet · Black · Raspberry

HEX
#1A1416
RGB
rgb(26, 20, 22)
HSL
hsl(340, 13%, 9%)
HSB
hsb(340, 23%, 10%)
CMYK
cmyk(0%, 23%, 15%, 90%)
Oklch
oklch(19.9% 0.010 356.1)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#3D2731

Dark Violet · DarkSlateGray · Raspberry

HEX
#3D2731
RGB
rgb(61, 39, 49)
HSL
hsl(333, 22%, 20%)
HSB
hsb(333, 36%, 24%)
CMYK
cmyk(0%, 36%, 20%, 76%)
Oklch
oklch(30.3% 0.037 350.6)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#8F566E

Dark Violet · DimGray · Camellia

HEX
#8F566E
RGB
rgb(143, 86, 110)
HSL
hsl(335, 25%, 45%)
HSB
hsb(335, 40%, 56%)
CMYK
cmyk(0%, 40%, 23%, 44%)
Oklch
oklch(52.5% 0.082 353.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#AD93AE

Lilac · DarkGray · Lilac Purple

HEX
#AD93AE
RGB
rgb(173, 147, 174)
HSL
hsl(298, 14%, 63%)
HSB
hsb(298, 16%, 68%)
CMYK
cmyk(1%, 16%, 0%, 32%)
Oklch
oklch(69.5% 0.049 324.9)

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

#F1D3C9

Apricot · Bisque · Peach Orange

HEX
#F1D3C9
RGB
rgb(241, 211, 201)
HSL
hsl(15, 59%, 87%)
HSB
hsb(15, 17%, 95%)
CMYK
cmyk(0%, 12%, 17%, 5%)
Oklch
oklch(88.9% 0.036 39.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

1A1416
141A18

Analogous

1A1419
1A1416
1A1514

Triadic

1A1416
161A14
14161A

Split-Comp.

1A1416
141A15
14191A

Tetradic

1A1416
191A14
141A18
15141A

Contrast Matrix WCAG 2.1 Contrast

1A1416
3D2731
8F566E
AD93AE
F1D3C9
—
1.3
Fail
3.2
AA Large
6.5
AA
12.9
AAA
1.3
Fail
—
2.4
Fail
4.9
AA
9.7
AAA
3.2
AA Large
2.4
Fail
—
2.0
Fail
4.0
AA Large
6.5
AA
4.9
AA
2.0
Fail
—
2.0
Fail
12.9
AAA
9.7
AAA
4.0
AA Large
2.0
Fail
—
White BG
18.2AAA
13.7AAA
5.6AA
2.8Fail
1.4Fail
Black BG
1.2Fail
1.5Fail
3.7AA Large
7.6AAA
14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

171716
33332F
767668
A2A2A7
E4E4CB

Deuteranopia

181815
35362E
7A7E67
A3A5A6
E6E8CC

Tritanopia

1A1515
3C2D2C
8C6463
ACA2A1
F0CDCE

Achromatopsia

161616
2F2F2F
6A6A6A
9E9E9E
DBDBDB

Shades & Tints Shades & Tints

#1A1416

Dark
Light

#3D2731

Dark
Light

#8F566E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #1a1416;
  --color-2: #3d2731;
  --color-3: #8f566e;
  --color-4: #ad93ae;
  --color-5: #f1d3c9;
}

SCSS

$color-1: #1a1416;
$color-2: #3d2731;
$color-3: #8f566e;
$color-4: #ad93ae;
$color-5: #f1d3c9;

TAILWIND

colors: {
  'brand-1': '#1a1416',
  'brand-2': '#3d2731',
  'brand-3': '#8f566e',
  'brand-4': '#ad93ae',
  'brand-5': '#f1d3c9',
}

RGB Array

[26, 20, 22], [61, 39, 49], [143, 86, 110], [173, 147, 174], [241, 211, 201]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #1A1416, #3D2731, #8F566E, #AD93AE, #F1D3C9 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: #1a1416; --color-2: #3d2731; --color-3: #8f566e; --color-4: #ad93ae; --color-5: #f1d3c9. 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