← Back to Editor

#4E5D5E · #4C999E · #B6CFA3 · #FAE7BB · #F74A4A

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 LibraryData Visualization

Color Details Color Details

#4E5D5E

Slate Blue · DimGray · Charcoal

HEX
#4E5D5E
RGB
rgb(78, 93, 94)
HSL
hsl(184, 9%, 34%)
HSB
hsb(184, 17%, 37%)
CMYK
cmyk(17%, 1%, 0%, 63%)
Oklch
oklch(46.6% 0.019 201.5)

Traditional「Slate Blue」· Paint「Charcoal」· Creative Midnight Shadow

#4C999E

Slate Blue · CadetBlue · Mint Ice

HEX
#4C999E
RGB
rgb(76, 153, 158)
HSL
hsl(184, 35%, 46%)
HSB
hsb(184, 52%, 62%)
CMYK
cmyk(52%, 3%, 0%, 38%)
Oklch
oklch(63.6% 0.076 201.0)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#B6CFA3

Celadon · Silver · Apple Green

HEX
#B6CFA3
RGB
rgb(182, 207, 163)
HSL
hsl(94, 31%, 73%)
HSB
hsb(94, 21%, 81%)
CMYK
cmyk(12%, 0%, 21%, 19%)
Oklch
oklch(82.4% 0.066 131.9)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#FAE7BB

Goose Yellow · Bisque · Lemon Cream

HEX
#FAE7BB
RGB
rgb(250, 231, 187)
HSL
hsl(42, 86%, 86%)
HSB
hsb(42, 25%, 98%)
CMYK
cmyk(0%, 8%, 25%, 2%)
Oklch
oklch(93.2% 0.061 87.4)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F74A4A

Peach Pink · Tomato · Coral Red

HEX
#F74A4A
RGB
rgb(247, 74, 74)
HSL
hsl(0, 92%, 63%)
HSB
hsb(0, 70%, 97%)
CMYK
cmyk(0%, 70%, 70%, 3%)
Oklch
oklch(65.7% 0.210 25.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4E5D5E
5F504F

Analogous

4F5F58
4E5D5E
4F565F

Triadic

4E5D5E
5F4F5D
5D5F4F

Split-Comp.

4E5D5E
5F4F56
5F584F

Tetradic

4E5D5E
584F5F
5F504F
565F4F

Contrast Matrix WCAG 2.1 Contrast

4E5D5E
4C999E
B6CFA3
FAE7BB
F74A4A
—
2.1
Fail
4.1
AA Large
5.6
AA
2.0
Fail
2.1
Fail
—
2.0
Fail
2.7
Fail
1.1
Fail
4.1
AA Large
2.0
Fail
—
1.4
Fail
2.1
Fail
5.6
AA
2.7
Fail
1.4
Fail
—
2.9
Fail
2.0
Fail
1.1
Fail
2.1
Fail
2.9
Fail
—
White BG
6.9AA
3.3AA Large
1.7Fail
1.2Fail
3.5AA Large
Black BG
3.1AA Large
6.4AA
12.4AAA
17.2AAA
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

54555E
6D6E9D
C1C1AE
F2F2C6
ACAB4A

Deuteranopia

54535E
69639D
BFBEB0
F3F4C8
B6C34A

Tritanopia

4F5E5E
509C9C
B7B6B8
F9CED0
EE4A4A

Achromatopsia

595959
838383
C3C3C3
E8E8E8
7E7E7E

Shades & Tints Shades & Tints

#4E5D5E

Dark
Light

#4C999E

Dark
Light

#B6CFA3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4e5d5e;
  --color-2: #4c999e;
  --color-3: #b6cfa3;
  --color-4: #fae7bb;
  --color-5: #f74a4a;
}

SCSS

$color-1: #4e5d5e;
$color-2: #4c999e;
$color-3: #b6cfa3;
$color-4: #fae7bb;
$color-5: #f74a4a;

TAILWIND

colors: {
  'brand-1': '#4e5d5e',
  'brand-2': '#4c999e',
  'brand-3': '#b6cfa3',
  'brand-4': '#fae7bb',
  'brand-5': '#f74a4a',
}

RGB Array

[78, 93, 94], [76, 153, 158], [182, 207, 163], [250, 231, 187], [247, 74, 74]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4E5D5E, #4C999E, #B6CFA3, #FAE7BB, #F74A4A is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #4e5d5e; --color-2: #4c999e; --color-3: #b6cfa3; --color-4: #fae7bb; --color-5: #f74a4a. 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. 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