← Back to Editor

#8593B3 · #F0FAFA · #A5C1F2 · #4A05EB · #C9C0BB

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

#8593B3

Azure · LightSlateGray · Cobalt Blue

HEX
#8593B3
RGB
rgb(133, 147, 179)
HSL
hsl(222, 23%, 61%)
HSB
hsb(222, 26%, 70%)
CMYK
cmyk(26%, 18%, 0%, 30%)
Oklch
oklch(66.3% 0.050 266.5)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#F0FAFA

Sky Blue · Snow · Glacier Blue

HEX
#F0FAFA
RGB
rgb(240, 250, 250)
HSL
hsl(180, 50%, 96%)
HSB
hsb(180, 4%, 98%)
CMYK
cmyk(4%, 0%, 0%, 2%)
Oklch
oklch(97.8% 0.011 197.0)

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

#A5C1F2

Azure · LightSteelBlue · Cobalt Blue

HEX
#A5C1F2
RGB
rgb(165, 193, 242)
HSL
hsl(218, 75%, 80%)
HSB
hsb(218, 32%, 95%)
CMYK
cmyk(32%, 20%, 0%, 5%)
Oklch
oklch(80.7% 0.076 261.5)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#4A05EB

Deep Indigo · Blue · Navy Blue

HEX
#4A05EB
RGB
rgb(74, 5, 235)
HSL
hsl(258, 96%, 47%)
HSB
hsb(258, 98%, 92%)
CMYK
cmyk(69%, 98%, 0%, 8%)
Oklch
oklch(45.8% 0.278 278.7)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#C9C0BB

Apricot · Silver · Peach Orange

HEX
#C9C0BB
RGB
rgb(201, 192, 187)
HSL
hsl(21, 11%, 76%)
HSB
hsb(21, 7%, 79%)
CMYK
cmyk(0%, 4%, 7%, 21%)
Oklch
oklch(81.4% 0.012 51.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8593B3
B2A585

Analogous

85A9B2
8593B3
8E85B2

Triadic

8593B3
B28592
92B285

Split-Comp.

8593B3
B28E85
A9B285

Tetradic

8593B3
B285A9
B2A585
85B28E

Contrast Matrix WCAG 2.1 Contrast

8593B3
F0FAFA
A5C1F2
4A05EB
C9C0BB
—
2.9
Fail
1.7
Fail
2.7
Fail
1.7
Fail
2.9
Fail
—
1.7
Fail
7.9
AAA
1.7
Fail
1.7
Fail
1.7
Fail
—
4.6
AA
1.0
Fail
2.7
Fail
7.9
AAA
4.6
AA
—
4.7
AA
1.7
Fail
1.7
Fail
1.0
Fail
4.7
AA
—
White BG
3.1AA Large
1.1Fail
1.8Fail
8.4AAA
1.8Fail
Black BG
6.8AA
19.8AAA
11.5AAA
2.5Fail
11.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8B8BAB
F4F4FA
B1B1E6
2C2CB3
C5C5BC

Deuteranopia

8A89A9
F4F3FA
B0ADE3
3035A6
C6C6BD

Tritanopia

86A5A4
F1FAFA
A6DDDB
47877E
C9BDBD

Achromatopsia

929292
F7F7F7
BEBEBE
343434
C2C2C2

Shades & Tints Shades & Tints

#8593B3

Dark
Light

#F0FAFA

Dark
Light

#A5C1F2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8593b3;
  --color-2: #f0fafa;
  --color-3: #a5c1f2;
  --color-4: #4a05eb;
  --color-5: #c9c0bb;
}

SCSS

$color-1: #8593b3;
$color-2: #f0fafa;
$color-3: #a5c1f2;
$color-4: #4a05eb;
$color-5: #c9c0bb;

TAILWIND

colors: {
  'brand-1': '#8593b3',
  'brand-2': '#f0fafa',
  'brand-3': '#a5c1f2',
  'brand-4': '#4a05eb',
  'brand-5': '#c9c0bb',
}

RGB Array

[133, 147, 179], [240, 250, 250], [165, 193, 242], [74, 5, 235], [201, 192, 187]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8593B3, #F0FAFA, #A5C1F2, #4A05EB, #C9C0BB 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: #8593b3; --color-2: #f0fafa; --color-3: #a5c1f2; --color-4: #4a05eb; --color-5: #c9c0bb. 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