← Back to Editor

#54494D · #B4D4D4 · #C6D6CC · #EFF6DB · #F59489

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#54494D

Ink Gray · DarkSlateGray · Charcoal

HEX
#54494D
RGB
rgb(84, 73, 77)
HSL
hsl(338, 7%, 31%)
HSB
hsb(338, 13%, 33%)
CMYK
cmyk(0%, 13%, 8%, 67%)
Oklch
oklch(41.8% 0.016 353.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#B4D4D4

Sky Blue · LightSteelBlue · Glacier Blue

HEX
#B4D4D4
RGB
rgb(180, 212, 212)
HSL
hsl(180, 27%, 77%)
HSB
hsb(180, 15%, 83%)
CMYK
cmyk(15%, 0%, 0%, 17%)
Oklch
oklch(84.7% 0.034 196.5)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#C6D6CC

Celadon · LightGray · Mint Green

HEX
#C6D6CC
RGB
rgb(198, 214, 204)
HSL
hsl(143, 16%, 81%)
HSB
hsb(143, 7%, 84%)
CMYK
cmyk(7%, 0%, 5%, 16%)
Oklch
oklch(86.1% 0.022 158.5)

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

#EFF6DB

Willow Green · Beige · Mint Green

HEX
#EFF6DB
RGB
rgb(239, 246, 219)
HSL
hsl(76, 60%, 91%)
HSB
hsb(76, 11%, 96%)
CMYK
cmyk(3%, 0%, 11%, 4%)
Oklch
oklch(96.1% 0.036 118.9)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#F59489

Peach Pink · DarkSalmon · Coral Red

HEX
#F59489
RGB
rgb(245, 148, 137)
HSL
hsl(6, 84%, 75%)
HSB
hsb(6, 44%, 96%)
CMYK
cmyk(0%, 40%, 44%, 4%)
Oklch
oklch(76.5% 0.119 27.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

54494D
4A5551

Analogous

554A53
54494D
554B4A

Triadic

54494D
4E554A
4A4E55

Split-Comp.

54494D
4A554B
4A5355

Tetradic

54494D
53554A
4A5551
4B4A55

Contrast Matrix WCAG 2.1 Contrast

54494D
B4D4D4
C6D6CC
EFF6DB
F59489
—
5.5
AA
5.7
AA
7.7
AAA
3.9
AA Large
5.5
AA
—
1.0
Fail
1.4
Fail
1.4
Fail
5.7
AA
1.0
Fail
—
1.4
Fail
1.5
Fail
7.7
AAA
1.4
Fail
1.4
Fail
—
2.0
Fail
3.9
AA Large
1.4
Fail
1.5
Fail
2.0
Fail
—
White BG
8.6AAA
1.6Fail
1.5Fail
1.1Fail
2.2Fail
Black BG
2.4Fail
13.3AAA
13.9AAA
18.9AAA
9.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F4F4C
C2C2D4
CDCDCE
F2F2E2
CBCA8C

Deuteranopia

50514C
C0BED4
CCCBCF
F2F1E3
D1D88C

Tritanopia

534B4B
B6D4D4
C7D0D1
EFE7E8
F08E8E

Achromatopsia

4D4D4D
CACACA
D0D0D0
F1F1F1
B0B0B0

Shades & Tints Shades & Tints

#54494D

Dark
Light

#B4D4D4

Dark
Light

#C6D6CC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #54494d;
  --color-2: #b4d4d4;
  --color-3: #c6d6cc;
  --color-4: #eff6db;
  --color-5: #f59489;
}

SCSS

$color-1: #54494d;
$color-2: #b4d4d4;
$color-3: #c6d6cc;
$color-4: #eff6db;
$color-5: #f59489;

TAILWIND

colors: {
  'brand-1': '#54494d',
  'brand-2': '#b4d4d4',
  'brand-3': '#c6d6cc',
  'brand-4': '#eff6db',
  'brand-5': '#f59489',
}

RGB Array

[84, 73, 77], [180, 212, 212], [198, 214, 204], [239, 246, 219], [245, 148, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #54494D, #B4D4D4, #C6D6CC, #EFF6DB, #F59489 is ideal for: health products, baby brands, fresh-style blogs, 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: #54494d; --color-2: #b4d4d4; --color-3: #c6d6cc; --color-4: #eff6db; --color-5: #f59489. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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