← Back to Editor

#3D2C50 · #A98A8F · #DCCBB9 · #F4F2E3 · #C7CCC6

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#3D2C50

Deep Indigo · DarkSlateGray · Eggplant

HEX
#3D2C50
RGB
rgb(61, 44, 80)
HSL
hsl(268, 29%, 24%)
HSB
hsb(268, 45%, 31%)
CMYK
cmyk(24%, 45%, 0%, 69%)
Oklch
oklch(33.0% 0.065 304.8)

TraditionalDeep Indigo」· PaintEggplant」· Creative Blush Sunrise

#A98A8F

Crimson · DarkGray · Passion Red

HEX
#A98A8F
RGB
rgb(169, 138, 143)
HSL
hsl(350, 15%, 60%)
HSB
hsb(350, 18%, 66%)
CMYK
cmyk(0%, 18%, 15%, 34%)
Oklch
oklch(66.4% 0.038 7.3)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#DCCBB9

Goose Yellow · LightGray · Peach Orange

HEX
#DCCBB9
RGB
rgb(220, 203, 185)
HSL
hsl(31, 33%, 79%)
HSB
hsb(31, 16%, 86%)
CMYK
cmyk(0%, 8%, 16%, 14%)
Oklch
oklch(85.1% 0.031 69.0)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#F4F2E3

Fresh Green · Linen · Lemon Cream

HEX
#F4F2E3
RGB
rgb(244, 242, 227)
HSL
hsl(53, 44%, 92%)
HSB
hsb(53, 7%, 96%)
CMYK
cmyk(0%, 1%, 7%, 4%)
Oklch
oklch(95.9% 0.020 100.6)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#C7CCC6

Silver Gray · Silver · Pearl Gray

HEX
#C7CCC6
RGB
rgb(199, 204, 198)
HSL
hsl(110, 6%, 79%)
HSB
hsb(110, 3%, 80%)
CMYK
cmyk(2%, 0%, 3%, 20%)
Oklch
oklch(84.0% 0.010 140.5)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3D2C50
3E4F2B

Analogous

2B2D4F
3D2C50
4E2B4F

Triadic

3D2C50
4F3C2B
2B4F3C

Split-Comp.

3D2C50
4F4E2B
2D4F2B

Tetradic

3D2C50
4F2B2D
3E4F2B
2B4F4E

Contrast Matrix WCAG 2.1 Contrast

3D2C50
A98A8F
DCCBB9
F4F2E3
C7CCC6
4.0
AA Large
7.9
AAA
11.1
AAA
7.7
AAA
4.0
AA Large
2.0
Fail
2.8
Fail
1.9
Fail
7.9
AAA
2.0
Fail
1.4
Fail
1.0
Fail
11.1
AAA
2.8
Fail
1.4
Fail
1.4
Fail
7.7
AAA
1.9
Fail
1.0
Fail
1.4
Fail
White BG
12.5AAA
3.1AA Large
1.6Fail
1.1Fail
1.6Fail
Black BG
1.7Fail
6.7AA
13.3AAA
18.7AAA
12.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

363547
9C9B8E
D5D4BD
F3F3E7
C9C9C7

Deuteranopia

373845
9DA08E
D6D7BE
F3F3E7
C9C8C8

Tritanopia

3C403F
A78D8D
DBC1C2
F4E9EA
C7C9C9

Achromatopsia

353535
949494
CECECE
F1F1F1
CACACA

Shades & Tints Shades & Tints

#3D2C50

Dark
Light

#A98A8F

Dark
Light

#DCCBB9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3d2c50;
  --color-2: #a98a8f;
  --color-3: #dccbb9;
  --color-4: #f4f2e3;
  --color-5: #c7ccc6;
}

SCSS

$color-1: #3d2c50;
$color-2: #a98a8f;
$color-3: #dccbb9;
$color-4: #f4f2e3;
$color-5: #c7ccc6;

TAILWIND

colors: {
  'brand-1': '#3d2c50',
  'brand-2': '#a98a8f',
  'brand-3': '#dccbb9',
  'brand-4': '#f4f2e3',
  'brand-5': '#c7ccc6',
}

RGB Array

[61, 44, 80], [169, 138, 143], [220, 203, 185], [244, 242, 227], [199, 204, 198]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3D2C50, #A98A8F, #DCCBB9, #F4F2E3, #C7CCC6 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, 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: #3d2c50; --color-2: #a98a8f; --color-3: #dccbb9; --color-4: #f4f2e3; --color-5: #c7ccc6. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 beauty, lifestyle, arts 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