← Back to Editor

#3B3425 · #726554 · #E7DCE2 · #D71988 · #8D8174

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

#3B3425

Ochre · DarkSlateGray · Amber Gold

HEX
#3B3425
RGB
rgb(59, 52, 37)
HSL
hsl(41, 23%, 19%)
HSB
hsb(41, 37%, 23%)
CMYK
cmyk(0%, 12%, 37%, 77%)
Oklch
oklch(32.8% 0.027 85.8)

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

#726554

Ochre · DimGray · Amber Brown

HEX
#726554
RGB
rgb(114, 101, 84)
HSL
hsl(34, 15%, 39%)
HSB
hsb(34, 26%, 45%)
CMYK
cmyk(0%, 11%, 26%, 55%)
Oklch
oklch(51.4% 0.031 74.4)

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

#E7DCE2

Mauve · Lavender · Cherry Blossom

HEX
#E7DCE2
RGB
rgb(231, 220, 226)
HSL
hsl(327, 19%, 88%)
HSB
hsb(327, 5%, 91%)
CMYK
cmyk(0%, 5%, 2%, 9%)
Oklch
oklch(90.5% 0.014 343.2)

Traditional「Mauve」· Paint「Cherry Blossom」· Creative Rose Petal

#D71988

Rose Purple · MediumVioletRed · Camellia

HEX
#D71988
RGB
rgb(215, 25, 136)
HSL
hsl(325, 79%, 47%)
HSB
hsb(325, 88%, 84%)
CMYK
cmyk(0%, 88%, 37%, 16%)
Oklch
oklch(58.4% 0.231 352.6)

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

#8D8174

Ochre · Gray · Amber Brown

HEX
#8D8174
RGB
rgb(141, 129, 116)
HSL
hsl(31, 10%, 50%)
HSB
hsb(31, 18%, 55%)
CMYK
cmyk(0%, 9%, 18%, 45%)
Oklch
oklch(61.0% 0.024 69.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3B3425
252C3C

Analogous

3C2925
3B3425
383C25

Triadic

3B3425
253C35
35253C

Split-Comp.

3B3425
25383C
29253C

Tetradic

3B3425
253C29
252C3C
3C2538

Contrast Matrix WCAG 2.1 Contrast

3B3425
726554
E7DCE2
D71988
8D8174
—
2.2
Fail
9.2
AAA
2.6
Fail
3.2
AA Large
2.2
Fail
—
4.2
AA Large
1.2
Fail
1.5
Fail
9.2
AAA
4.2
AA Large
—
3.6
AA Large
2.8
Fail
2.6
Fail
1.2
Fail
3.6
AA Large
—
1.3
Fail
3.2
AA Large
1.5
Fail
2.8
Fail
1.3
Fail
—
White BG
12.3AAA
5.7AA
1.3Fail
4.8AA
3.8AA Large
Black BG
1.7Fail
3.7AA Large
15.7AAA
4.4AA Large
5.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

383829
6C6C58
E2E2E1
85836D
888877

Deuteranopia

38392A
6D6E59
E3E4E0
909E67
898978

Tritanopia

3B2B2C
715B5C
E6DFDF
CE5853
8C7A7A

Achromatopsia

343434
676767
E0E0E0
5E5E5E
838383

Shades & Tints Shades & Tints

#3B3425

Dark
Light

#726554

Dark
Light

#E7DCE2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3b3425;
  --color-2: #726554;
  --color-3: #e7dce2;
  --color-4: #d71988;
  --color-5: #8d8174;
}

SCSS

$color-1: #3b3425;
$color-2: #726554;
$color-3: #e7dce2;
$color-4: #d71988;
$color-5: #8d8174;

TAILWIND

colors: {
  'brand-1': '#3b3425',
  'brand-2': '#726554',
  'brand-3': '#e7dce2',
  'brand-4': '#d71988',
  'brand-5': '#8d8174',
}

RGB Array

[59, 52, 37], [114, 101, 84], [231, 220, 226], [215, 25, 136], [141, 129, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3B3425, #726554, #E7DCE2, #D71988, #8D8174 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: #3b3425; --color-2: #726554; --color-3: #e7dce2; --color-4: #d71988; --color-5: #8d8174. 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