← Back to Editor

#544F57 · #95C2B3 · #ACD0BC · #E3D8AA · #F8D3A4

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

#544F57

Ink Gray · DarkSlateGray · Charcoal

HEX
#544F57
RGB
rgb(84, 79, 87)
HSL
hsl(278, 5%, 33%)
HSB
hsb(278, 9%, 34%)
CMYK
cmyk(3%, 9%, 0%, 66%)
Oklch
oklch(43.5% 0.014 313.1)

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

#95C2B3

Jade · DarkGray · Lake Green

HEX
#95C2B3
RGB
rgb(149, 194, 179)
HSL
hsl(160, 27%, 67%)
HSB
hsb(160, 23%, 76%)
CMYK
cmyk(23%, 0%, 8%, 24%)
Oklch
oklch(77.8% 0.052 172.5)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#ACD0BC

Celadon · Silver · Apple Green

HEX
#ACD0BC
RGB
rgb(172, 208, 188)
HSL
hsl(147, 28%, 75%)
HSB
hsb(147, 17%, 82%)
CMYK
cmyk(17%, 0%, 10%, 18%)
Oklch
oklch(82.6% 0.047 160.9)

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

#E3D8AA

Goose Yellow · Wheat · Lemon Cream

HEX
#E3D8AA
RGB
rgb(227, 216, 170)
HSL
hsl(48, 50%, 78%)
HSB
hsb(48, 25%, 89%)
CMYK
cmyk(0%, 5%, 25%, 11%)
Oklch
oklch(88.0% 0.062 96.2)

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

#F8D3A4

Goose Yellow · Wheat · Peach Orange

HEX
#F8D3A4
RGB
rgb(248, 211, 164)
HSL
hsl(34, 86%, 81%)
HSB
hsb(34, 34%, 97%)
CMYK
cmyk(0%, 15%, 34%, 3%)
Oklch
oklch(88.7% 0.074 73.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

544F57
535850

Analogous

515058
544F57
585057

Triadic

544F57
585550
505855

Split-Comp.

544F57
575850
505851

Tetradic

544F57
585150
535850
505758

Contrast Matrix WCAG 2.1 Contrast

544F57
95C2B3
ACD0BC
E3D8AA
F8D3A4
—
4.0
AA Large
4.7
AA
5.6
AA
5.6
AA
4.0
AA Large
—
1.2
Fail
1.4
Fail
1.4
Fail
4.7
AA
1.2
Fail
—
1.2
Fail
1.2
Fail
5.6
AA
1.4
Fail
1.2
Fail
—
1.0
Fail
5.6
AA
1.4
Fail
1.2
Fail
1.0
Fail
—
White BG
8.0AAA
2.0Fail
1.7Fail
1.4Fail
1.4Fail
Black BG
2.6Fail
10.6AAA
12.5AAA
14.7AAA
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

525255
A8A9B7
BCBCC1
DEDEB5
E8E8AF

Deuteranopia

525355
A6A3B8
BAB7C2
DFE0B8
EAEDB2

Tritanopia

545453
97B9BA
AEC5C6
E2BEC0
F6B8BA

Achromatopsia

515151
B3B3B3
C3C3C3
D6D6D6
D9D9D9

Shades & Tints Shades & Tints

#544F57

Dark
Light

#95C2B3

Dark
Light

#ACD0BC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #544f57;
  --color-2: #95c2b3;
  --color-3: #acd0bc;
  --color-4: #e3d8aa;
  --color-5: #f8d3a4;
}

SCSS

$color-1: #544f57;
$color-2: #95c2b3;
$color-3: #acd0bc;
$color-4: #e3d8aa;
$color-5: #f8d3a4;

TAILWIND

colors: {
  'brand-1': '#544f57',
  'brand-2': '#95c2b3',
  'brand-3': '#acd0bc',
  'brand-4': '#e3d8aa',
  'brand-5': '#f8d3a4',
}

RGB Array

[84, 79, 87], [149, 194, 179], [172, 208, 188], [227, 216, 170], [248, 211, 164]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #544F57, #95C2B3, #ACD0BC, #E3D8AA, #F8D3A4 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: #544f57; --color-2: #95c2b3; --color-3: #acd0bc; --color-4: #e3d8aa; --color-5: #f8d3a4. 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