← Back to Editor

#4C2535 · #754252 · #7D6869 · #898A7C · #889F97

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 Library

Color Details Color Details

#4C2535

Dark Violet · DarkSlateGray · Raspberry

HEX
#4C2535
RGB
rgb(76, 37, 53)
HSL
hsl(335, 35%, 22%)
HSB
hsb(335, 51%, 30%)
CMYK
cmyk(0%, 51%, 30%, 70%)
Oklch
oklch(32.3% 0.062 355.2)

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

#754252

Dark Violet · DimGray · Camellia

HEX
#754252
RGB
rgb(117, 66, 82)
HSL
hsl(341, 28%, 36%)
HSB
hsb(341, 44%, 46%)
CMYK
cmyk(0%, 44%, 30%, 54%)
Oklch
oklch(44.5% 0.073 0.3)

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

#7D6869

Crimson · DimGray · Warm Gray

HEX
#7D6869
RGB
rgb(125, 104, 105)
HSL
hsl(357, 9%, 45%)
HSB
hsb(357, 17%, 49%)
CMYK
cmyk(0%, 17%, 16%, 51%)
Oklch
oklch(53.8% 0.027 14.8)

Traditional「Crimson」· Paint「Warm Gray」· Creative Urban Concrete

#898A7C

Ash · Gray · Warm Gray

HEX
#898A7C
RGB
rgb(137, 138, 124)
HSL
hsl(64, 6%, 51%)
HSB
hsb(64, 10%, 54%)
CMYK
cmyk(1%, 0%, 10%, 46%)
Oklch
oklch(62.8% 0.020 110.3)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#889F97

Mineral Blue · LightSlateGray · Olive Green

HEX
#889F97
RGB
rgb(136, 159, 151)
HSL
hsl(159, 11%, 58%)
HSB
hsb(159, 14%, 62%)
CMYK
cmyk(14%, 0%, 5%, 38%)
Oklch
oklch(68.2% 0.028 172.4)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4C2535
244C3B

Analogous

4C2448
4C2535
4C2824

Triadic

4C2535
354C24
24354C

Split-Comp.

4C2535
244C28
24484C

Tetradic

4C2535
484C24
244C3B
28244C

Contrast Matrix WCAG 2.1 Contrast

4C2535
754252
7D6869
898A7C
889F97
—
1.6
Fail
2.5
Fail
3.7
AA Large
4.6
AA
1.6
Fail
—
1.5
Fail
2.3
Fail
2.8
Fail
2.5
Fail
1.5
Fail
—
1.5
Fail
1.8
Fail
3.7
AA Large
2.3
Fail
1.5
Fail
—
1.2
Fail
4.6
AA
2.8
Fail
1.8
Fail
1.2
Fail
—
White BG
12.9AAA
7.9AAA
5.2AA
3.5AA Large
2.8Fail
Black BG
1.6Fail
2.7Fail
4.1AA Large
6.0AA
7.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3B3B31
5F5E4E
747469
89897F
929299

Deuteranopia

3D4030
62664D
757769
898980
918F99

Tritanopia

4A2E2D
724B4A
7C6969
898283
899A9B

Achromatopsia

323232
535353
6E6E6E
888888
979797

Shades & Tints Shades & Tints

#4C2535

Dark
Light

#754252

Dark
Light

#7D6869

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4c2535;
  --color-2: #754252;
  --color-3: #7d6869;
  --color-4: #898a7c;
  --color-5: #889f97;
}

SCSS

$color-1: #4c2535;
$color-2: #754252;
$color-3: #7d6869;
$color-4: #898a7c;
$color-5: #889f97;

TAILWIND

colors: {
  'brand-1': '#4c2535',
  'brand-2': '#754252',
  'brand-3': '#7d6869',
  'brand-4': '#898a7c',
  'brand-5': '#889f97',
}

RGB Array

[76, 37, 53], [117, 66, 82], [125, 104, 105], [137, 138, 124], [136, 159, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4C2535, #754252, #7D6869, #898A7C, #889F97 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. 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: #4c2535; --color-2: #754252; --color-3: #7d6869; --color-4: #898a7c; --color-5: #889f97. 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. 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