← Back to Editor

#594D4F · #B5B0B1 · #FFFFFF · #B07D87 · #F7A8B8

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#594D4F

Ink Gray · DimGray · Charcoal

HEX
#594D4F
RGB
rgb(89, 77, 79)
HSL
hsl(350, 7%, 33%)
HSB
hsb(350, 13%, 35%)
CMYK
cmyk(0%, 13%, 11%, 65%)
Oklch
oklch(43.3% 0.016 6.4)

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

#B5B0B1

Ash · DarkGray · Silver Sand

HEX
#B5B0B1
RGB
rgb(181, 176, 177)
HSL
hsl(348, 3%, 70%)
HSB
hsb(348, 3%, 71%)
CMYK
cmyk(0%, 3%, 2%, 29%)
Oklch
oklch(76.2% 0.006 3.4)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#FFFFFF

Moonlight White · White · Cloud White

HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
HSB
hsb(0, 0%, 100%)
CMYK
cmyk(0%, 0%, 0%, 0%)
Oklch
oklch(100.0% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

#B07D87

Crimson · Gray · Passion Red

HEX
#B07D87
RGB
rgb(176, 125, 135)
HSL
hsl(348, 24%, 59%)
HSB
hsb(348, 29%, 69%)
CMYK
cmyk(0%, 29%, 23%, 31%)
Oklch
oklch(64.4% 0.065 6.1)

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

#F7A8B8

Peach Pink · LightPink · Cherry Blossom

HEX
#F7A8B8
RGB
rgb(247, 168, 184)
HSL
hsl(348, 83%, 81%)
HSB
hsb(348, 32%, 97%)
CMYK
cmyk(0%, 32%, 26%, 3%)
Oklch
oklch(81.2% 0.095 6.1)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

594D4F
4E5A58

Analogous

5A4E56
594D4F
5A524E

Triadic

594D4F
505A4E
4E505A

Split-Comp.

594D4F
4E5A52
4E565A

Tetradic

594D4F
565A4E
4E5A58
524E5A

Contrast Matrix WCAG 2.1 Contrast

594D4F
B5B0B1
FFFFFF
B07D87
F7A8B8
—
3.8
AA Large
8.1
AAA
2.4
Fail
4.3
AA Large
3.8
AA Large
—
2.1
Fail
1.6
Fail
1.1
Fail
8.1
AAA
2.1
Fail
—
3.4
AA Large
1.9
Fail
2.4
Fail
1.6
Fail
3.4
AA Large
—
1.8
Fail
4.3
AA Large
1.1
Fail
1.9
Fail
1.8
Fail
—
White BG
8.1AAA
2.1Fail
1.0Fail
3.4AA Large
1.9Fail
Black BG
2.6Fail
9.8AAA
21.0AAA
6.1AA
11.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

54544F
B3B3B1
FFFFFF
9A9985
D5D4B4

Deuteranopia

55554E
B3B4B1
FFFFFF
9DA184
D9DFB3

Tritanopia

584E4E
B5B1B1
FFFFFF
AD8382
F3B1B0

Achromatopsia

515151
B2B2B2
FFFFFF
8D8D8D
C1C1C1

Shades & Tints Shades & Tints

#594D4F

Dark
Light

#B5B0B1

Dark
Light

#FFFFFF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #594d4f;
  --color-2: #b5b0b1;
  --color-3: #ffffff;
  --color-4: #b07d87;
  --color-5: #f7a8b8;
}

SCSS

$color-1: #594d4f;
$color-2: #b5b0b1;
$color-3: #ffffff;
$color-4: #b07d87;
$color-5: #f7a8b8;

TAILWIND

colors: {
  'brand-1': '#594d4f',
  'brand-2': '#b5b0b1',
  'brand-3': '#ffffff',
  'brand-4': '#b07d87',
  'brand-5': '#f7a8b8',
}

RGB Array

[89, 77, 79], [181, 176, 177], [255, 255, 255], [176, 125, 135], [247, 168, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #594D4F, #B5B0B1, #FFFFFF, #B07D87, #F7A8B8 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #594d4f; --color-2: #b5b0b1; --color-3: #ffffff; --color-4: #b07d87; --color-5: #f7a8b8. 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 beauty, lifestyle, arts 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