← Back to Editor

#4F5160 · #C07478 · #C09584 · #B4A190 · #63A2B3

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

#4F5160

Indigo · DarkSlateGray · Prussian Blue

HEX
#4F5160
RGB
rgb(79, 81, 96)
HSL
hsl(233, 10%, 34%)
HSB
hsb(233, 18%, 38%)
CMYK
cmyk(18%, 16%, 0%, 62%)
Oklch
oklch(43.9% 0.025 279.3)

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

#C07478

Crimson · LightCoral · Passion Red

HEX
#C07478
RGB
rgb(192, 116, 120)
HSL
hsl(357, 38%, 60%)
HSB
hsb(357, 40%, 75%)
CMYK
cmyk(0%, 40%, 38%, 25%)
Oklch
oklch(64.2% 0.096 16.7)

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

#C09584

Apricot · Tan · Warm Sun

HEX
#C09584
RGB
rgb(192, 149, 132)
HSL
hsl(17, 32%, 64%)
HSB
hsb(17, 31%, 75%)
CMYK
cmyk(0%, 22%, 31%, 25%)
Oklch
oklch(70.6% 0.058 42.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#B4A190

Apricot · DarkGray · Warm Sun

HEX
#B4A190
RGB
rgb(180, 161, 144)
HSL
hsl(28, 19%, 64%)
HSB
hsb(28, 20%, 71%)
CMYK
cmyk(0%, 11%, 20%, 29%)
Oklch
oklch(72.1% 0.033 64.1)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#63A2B3

Slate Blue · CadetBlue · Lake Green

HEX
#63A2B3
RGB
rgb(99, 162, 179)
HSL
hsl(193, 34%, 55%)
HSB
hsb(193, 45%, 70%)
CMYK
cmyk(45%, 9%, 0%, 30%)
Oklch
oklch(67.6% 0.069 216.9)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4F5160
5F5D4E

Analogous

4E595F
4F5160
554E5F

Triadic

4F5160
5F4E50
505F4E

Split-Comp.

4F5160
5F554E
595F4E

Tetradic

4F5160
5F4E59
5F5D4E
4E5F55

Contrast Matrix WCAG 2.1 Contrast

4F5160
C07478
C09584
B4A190
63A2B3
—
2.2
Fail
2.9
Fail
3.2
AA Large
2.7
Fail
2.2
Fail
—
1.3
Fail
1.4
Fail
1.2
Fail
2.9
Fail
1.3
Fail
—
1.1
Fail
1.1
Fail
3.2
AA Large
1.4
Fail
1.1
Fail
—
1.1
Fail
2.7
Fail
1.2
Fail
1.1
Fail
1.1
Fail
—
White BG
7.8AAA
3.5AA Large
2.7Fail
2.5Fail
2.9Fail
Black BG
2.7Fail
6.0AA
7.9AAA
8.4AAA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

50505C
9F9E77
ADAD88
ACAC94
7E7FAF

Deuteranopia

50505B
A4A977
B0B389
ADAE95
7B76AE

Tritanopia

4F5A59
BC7676
BE8B8C
B39798
66ACAB

Achromatopsia

525252
8B8B8B
A0A0A0
A5A5A5
919191

Shades & Tints Shades & Tints

#4F5160

Dark
Light

#C07478

Dark
Light

#C09584

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4f5160;
  --color-2: #c07478;
  --color-3: #c09584;
  --color-4: #b4a190;
  --color-5: #63a2b3;
}

SCSS

$color-1: #4f5160;
$color-2: #c07478;
$color-3: #c09584;
$color-4: #b4a190;
$color-5: #63a2b3;

TAILWIND

colors: {
  'brand-1': '#4f5160',
  'brand-2': '#c07478',
  'brand-3': '#c09584',
  'brand-4': '#b4a190',
  'brand-5': '#63a2b3',
}

RGB Array

[79, 81, 96], [192, 116, 120], [192, 149, 132], [180, 161, 144], [99, 162, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4F5160, #C07478, #C09584, #B4A190, #63A2B3 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: #4f5160; --color-2: #c07478; --color-3: #c09584; --color-4: #b4a190; --color-5: #63a2b3. 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