← Back to Editor

#4B8FB4 · #799DAB · #C5B0B5 · #BCBDB7 · #AED1BD

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

WorkspaceReading

Color Details Color Details

#4B8FB4

Slate Blue · SteelBlue · Navy Blue

HEX
#4B8FB4
RGB
rgb(75, 143, 180)
HSL
hsl(201, 41%, 50%)
HSB
hsb(201, 58%, 71%)
CMYK
cmyk(58%, 21%, 0%, 29%)
Oklch
oklch(62.1% 0.089 234.5)

TraditionalSlate Blue」· PaintNavy Blue」· Creative Blush Sunrise

#799DAB

Slate Blue · LightSlateGray · Lake Green

HEX
#799DAB
RGB
rgb(121, 157, 171)
HSL
hsl(197, 23%, 57%)
HSB
hsb(197, 29%, 67%)
CMYK
cmyk(29%, 8%, 0%, 33%)
Oklch
oklch(67.4% 0.045 223.7)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

#C5B0B5

Peach Pink · Silver · Coral Red

HEX
#C5B0B5
RGB
rgb(197, 176, 181)
HSL
hsl(346, 15%, 73%)
HSB
hsb(346, 11%, 77%)
CMYK
cmyk(0%, 11%, 8%, 23%)
Oklch
oklch(77.7% 0.025 1.5)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#BCBDB7

Silver Gray · Silver · Pearl Gray

HEX
#BCBDB7
RGB
rgb(188, 189, 183)
HSL
hsl(70, 4%, 73%)
HSB
hsb(70, 3%, 74%)
CMYK
cmyk(1%, 0%, 3%, 26%)
Oklch
oklch(79.6% 0.008 114.3)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#AED1BD

Celadon · Silver · Apple Green

HEX
#AED1BD
RGB
rgb(174, 209, 189)
HSL
hsl(146, 28%, 75%)
HSB
hsb(146, 17%, 82%)
CMYK
cmyk(17%, 0%, 10%, 18%)
Oklch
oklch(83.0% 0.046 160.2)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B8FB4
B4704B

Analogous

4BB4A4
4B8FB4
4B5BB4

Triadic

4B8FB4
B44B8F
8FB44B

Split-Comp.

4B8FB4
B44B5B
B4A44B

Tetradic

4B8FB4
A44BB4
B4704B
5BB44B

Contrast Matrix WCAG 2.1 Contrast

4B8FB4
799DAB
C5B0B5
BCBDB7
AED1BD
1.2
Fail
1.7
Fail
1.9
Fail
2.1
Fail
1.2
Fail
1.4
Fail
1.5
Fail
1.8
Fail
1.7
Fail
1.4
Fail
1.1
Fail
1.2
Fail
1.9
Fail
1.5
Fail
1.1
Fail
1.1
Fail
2.1
Fail
1.8
Fail
1.2
Fail
1.1
Fail
White BG
3.6AA Large
2.9Fail
2.0Fail
1.9Fail
1.7Fail
Black BG
5.9AA
7.2AAA
10.3AAA
11.1AAA
12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6869AB
8989A8
BCBCB4
BCBCB8
BDBDC2

Deuteranopia

655FA9
8784A7
BDBFB4
BCBCB9
BBB9C3

Tritanopia

4EA4A2
7BA5A4
C4B3B3
BCBABA
B0C6C7

Achromatopsia

7F7F7F
949494
B7B7B7
BCBCBC
C4C4C4

Shades & Tints Shades & Tints

#4B8FB4

Dark
Light

#799DAB

Dark
Light

#C5B0B5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b8fb4;
  --color-2: #799dab;
  --color-3: #c5b0b5;
  --color-4: #bcbdb7;
  --color-5: #aed1bd;
}

SCSS

$color-1: #4b8fb4;
$color-2: #799dab;
$color-3: #c5b0b5;
$color-4: #bcbdb7;
$color-5: #aed1bd;

TAILWIND

colors: {
  'brand-1': '#4b8fb4',
  'brand-2': '#799dab',
  'brand-3': '#c5b0b5',
  'brand-4': '#bcbdb7',
  'brand-5': '#aed1bd',
}

RGB Array

[75, 143, 180], [121, 157, 171], [197, 176, 181], [188, 189, 183], [174, 209, 189]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4B8FB4, #799DAB, #C5B0B5, #BCBDB7, #AED1BD is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. 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: #4b8fb4; --color-2: #799dab; --color-3: #c5b0b5; --color-4: #bcbdb7; --color-5: #aed1bd. 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. 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