← Back to Editor

#4B4E5C · #995165 · #B35A56 · #C26B53 · #D1814F

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

#4B4E5C

Indigo · DarkSlateGray · Prussian Blue

HEX
#4B4E5C
RGB
rgb(75, 78, 92)
HSL
hsl(229, 10%, 33%)
HSB
hsb(229, 18%, 36%)
CMYK
cmyk(18%, 15%, 0%, 64%)
Oklch
oklch(42.7% 0.023 275.8)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#995165

Dark Violet · DimGray · Camellia

HEX
#995165
RGB
rgb(153, 81, 101)
HSL
hsl(343, 31%, 46%)
HSB
hsb(343, 47%, 60%)
CMYK
cmyk(0%, 47%, 34%, 40%)
Oklch
oklch(52.7% 0.098 3.3)

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

#B35A56

Crimson · Sienna · Passion Red

HEX
#B35A56
RGB
rgb(179, 90, 86)
HSL
hsl(3, 38%, 52%)
HSB
hsb(3, 52%, 70%)
CMYK
cmyk(0%, 50%, 52%, 30%)
Oklch
oklch(57.4% 0.116 24.0)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#C26B53

Crimson · Chocolate · Passion Red

HEX
#C26B53
RGB
rgb(194, 107, 83)
HSL
hsl(13, 48%, 54%)
HSB
hsb(13, 57%, 76%)
CMYK
cmyk(0%, 45%, 57%, 24%)
Oklch
oklch(62.1% 0.117 36.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#D1814F

Tangerine · Coral · Warm Sun

HEX
#D1814F
RGB
rgb(209, 129, 79)
HSL
hsl(23, 59%, 56%)
HSB
hsb(23, 62%, 82%)
CMYK
cmyk(0%, 38%, 62%, 18%)
Oklch
oklch(67.8% 0.119 51.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B4E5C
5D594C

Analogous

4C575D
4B4E5C
514C5D

Triadic

4B4E5C
5D4C4F
4F5D4C

Split-Comp.

4B4E5C
5D514C
575D4C

Tetradic

4B4E5C
5D4C57
5D594C
4C5D51

Contrast Matrix WCAG 2.1 Contrast

4B4E5C
995165
B35A56
C26B53
D1814F
—
1.5
Fail
1.8
Fail
2.2
Fail
2.7
Fail
1.5
Fail
—
1.2
Fail
1.5
Fail
1.9
Fail
1.8
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
2.2
Fail
1.5
Fail
1.2
Fail
—
1.3
Fail
2.7
Fail
1.9
Fail
1.5
Fail
1.3
Fail
—
White BG
8.3AAA
5.6AA
4.7AA
3.8AA Large
3.0AA Large
Black BG
2.5Fail
3.7AA Large
4.5AA
5.5AA
7.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4C59
7A7960
8C8C57
9C9C59
AEAE5B

Deuteranopia

4C4C58
7E835F
929857
A1A85A
B3B95E

Tritanopia

4B5655
955C5C
AF5858
BE5D5E
CD6567

Achromatopsia

4F4F4F
696969
747474
828282
939393

Shades & Tints Shades & Tints

#4B4E5C

Dark
Light

#995165

Dark
Light

#B35A56

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b4e5c;
  --color-2: #995165;
  --color-3: #b35a56;
  --color-4: #c26b53;
  --color-5: #d1814f;
}

SCSS

$color-1: #4b4e5c;
$color-2: #995165;
$color-3: #b35a56;
$color-4: #c26b53;
$color-5: #d1814f;

TAILWIND

colors: {
  'brand-1': '#4b4e5c',
  'brand-2': '#995165',
  'brand-3': '#b35a56',
  'brand-4': '#c26b53',
  'brand-5': '#d1814f',
}

RGB Array

[75, 78, 92], [153, 81, 101], [179, 90, 86], [194, 107, 83], [209, 129, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4B4E5C, #995165, #B35A56, #C26B53, #D1814F is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #4b4e5c; --color-2: #995165; --color-3: #b35a56; --color-4: #c26b53; --color-5: #d1814f. 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. 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