← Back to Editor

#8BA5B8 · #759DD0 · #909EC0 · #ACA0B0 · #C7A1A2

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

#8BA5B8

Sky Blue · DarkGray · Cobalt Blue

HEX
#8BA5B8
RGB
rgb(139, 165, 184)
HSL
hsl(205, 24%, 63%)
HSB
hsb(205, 24%, 72%)
CMYK
cmyk(24%, 10%, 0%, 28%)
Oklch
oklch(70.9% 0.040 239.9)

TraditionalSky Blue」· PaintCobalt Blue」· Creative Twilight Haze

#759DD0

Azure · CornflowerBlue · Cobalt Blue

HEX
#759DD0
RGB
rgb(117, 157, 208)
HSL
hsl(214, 49%, 64%)
HSB
hsb(214, 44%, 82%)
CMYK
cmyk(44%, 25%, 0%, 18%)
Oklch
oklch(68.7% 0.088 254.8)

TraditionalAzure」· PaintCobalt Blue」· Creative Twilight Haze

#909EC0

Azure · DarkGray · Cobalt Blue

HEX
#909EC0
RGB
rgb(144, 158, 192)
HSL
hsl(222, 28%, 66%)
HSB
hsb(222, 25%, 75%)
CMYK
cmyk(25%, 18%, 0%, 25%)
Oklch
oklch(70.0% 0.052 267.5)

TraditionalAzure」· PaintCobalt Blue」· Creative Twilight Haze

#ACA0B0

Lilac · DarkGray · Silver Sand

HEX
#ACA0B0
RGB
rgb(172, 160, 176)
HSL
hsl(285, 9%, 66%)
HSB
hsb(285, 9%, 69%)
CMYK
cmyk(2%, 9%, 0%, 31%)
Oklch
oklch(72.1% 0.027 317.7)

TraditionalLilac」· PaintSilver Sand」· Creative Urban Concrete

#C7A1A2

Peach Pink · Tan · Coral Red

HEX
#C7A1A2
RGB
rgb(199, 161, 162)
HSL
hsl(358, 25%, 71%)
HSB
hsb(358, 19%, 78%)
CMYK
cmyk(0%, 19%, 19%, 22%)
Oklch
oklch(74.4% 0.045 16.4)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8BA5B8
B79D8A

Analogous

8AB7B4
8BA5B8
8A8EB7

Triadic

8BA5B8
B78AA4
A4B78A

Split-Comp.

8BA5B8
B78A8E
B7B48A

Tetradic

8BA5B8
B48AB7
B79D8A
8EB78A

Contrast Matrix WCAG 2.1 Contrast

8BA5B8
759DD0
909EC0
ACA0B0
C7A1A2
1.1
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.1
Fail
1.2
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.2
Fail
1.1
Fail
White BG
2.6Fail
2.8Fail
2.7Fail
2.5Fail
2.3Fail
Black BG
8.2AAA
7.5AAA
7.8AAA
8.4AAA
9.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9696B3
8687C4
9696B8
A7A7AC
B7B6A2

Deuteranopia

9593B2
8481C1
9594B6
A8A8AB
B9BCA2

Tritanopia

8CB0AF
77BAB8
91B1B0
ABA9A8
C5A2A2

Achromatopsia

9F9F9F
979797
9E9E9E
A5A5A5
ACACAC

Shades & Tints Shades & Tints

#8BA5B8

Dark
Light

#759DD0

Dark
Light

#909EC0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8ba5b8;
  --color-2: #759dd0;
  --color-3: #909ec0;
  --color-4: #aca0b0;
  --color-5: #c7a1a2;
}

SCSS

$color-1: #8ba5b8;
$color-2: #759dd0;
$color-3: #909ec0;
$color-4: #aca0b0;
$color-5: #c7a1a2;

TAILWIND

colors: {
  'brand-1': '#8ba5b8',
  'brand-2': '#759dd0',
  'brand-3': '#909ec0',
  'brand-4': '#aca0b0',
  'brand-5': '#c7a1a2',
}

RGB Array

[139, 165, 184], [117, 157, 208], [144, 158, 192], [172, 160, 176], [199, 161, 162]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8BA5B8, #759DD0, #909EC0, #ACA0B0, #C7A1A2 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: #8ba5b8; --color-2: #759dd0; --color-3: #909ec0; --color-4: #aca0b0; --color-5: #c7a1a2. 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