← Back to Editor

#96B1C9 · #85CBEE · #0BA6DA · #2381CF · #3239CD

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#96B1C9

Sky Blue · DarkGray · Cobalt Blue

HEX
#96B1C9
RGB
rgb(150, 177, 201)
HSL
hsl(208, 32%, 69%)
HSB
hsb(208, 25%, 79%)
CMYK
cmyk(25%, 12%, 0%, 21%)
Oklch
oklch(74.8% 0.046 245.3)

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

#85CBEE

Sky Blue · SkyBlue · Cobalt Blue

HEX
#85CBEE
RGB
rgb(133, 203, 238)
HSL
hsl(200, 76%, 73%)
HSB
hsb(200, 44%, 93%)
CMYK
cmyk(44%, 15%, 0%, 7%)
Oklch
oklch(80.8% 0.086 230.9)

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

#0BA6DA

Lake Blue · DarkTurquoise · Mint Ice

HEX
#0BA6DA
RGB
rgb(11, 166, 218)
HSL
hsl(195, 90%, 45%)
HSB
hsb(195, 95%, 85%)
CMYK
cmyk(95%, 24%, 0%, 15%)
Oklch
oklch(67.9% 0.134 229.9)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#2381CF

Lake Blue · SteelBlue · Navy Blue

HEX
#2381CF
RGB
rgb(35, 129, 207)
HSL
hsl(207, 71%, 47%)
HSB
hsb(207, 83%, 81%)
CMYK
cmyk(83%, 38%, 0%, 19%)
Oklch
oklch(58.9% 0.146 248.9)

Traditional「Lake Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#3239CD

Indigo · SlateBlue · Navy Blue

HEX
#3239CD
RGB
rgb(50, 57, 205)
HSL
hsl(237, 61%, 50%)
HSB
hsb(237, 76%, 80%)
CMYK
cmyk(76%, 72%, 0%, 20%)
Oklch
oklch(45.1% 0.221 271.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

96B1C9
C9AE97

Analogous

97C9C8
96B1C9
9798C9

Triadic

96B1C9
C997B2
B2C997

Split-Comp.

96B1C9
C99798
C9C897

Tetradic

96B1C9
C897C9
C9AE97
98C997

Contrast Matrix WCAG 2.1 Contrast

96B1C9
85CBEE
0BA6DA
2381CF
3239CD
—
1.2
Fail
1.3
Fail
1.8
Fail
3.6
AA Large
1.2
Fail
—
1.6
Fail
2.3
Fail
4.5
AA
1.3
Fail
1.6
Fail
—
1.5
Fail
2.9
Fail
1.8
Fail
2.3
Fail
1.5
Fail
—
2.0
Fail
3.6
AA Large
4.5
AA
2.9
Fail
2.0
Fail
—
White BG
2.2Fail
1.8Fail
2.8Fail
4.1AA Large
8.1AAA
Black BG
9.4AAA
11.8AAA
7.5AAA
5.1AA
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A2C3
A3A4E6
4E50CD
4C4DBC
3535A9

Deuteranopia

A09EC2
9F9AE4
453ACA
463FB8
3534A1

Tritanopia

97BFBE
89DFDD
13C3C1
28ADAA
328D87

Achromatopsia

ACACAC
BABABA
7E7E7E
6E6E6E
484848

Shades & Tints Shades & Tints

#96B1C9

Dark
Light

#85CBEE

Dark
Light

#0BA6DA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #96b1c9;
  --color-2: #85cbee;
  --color-3: #0ba6da;
  --color-4: #2381cf;
  --color-5: #3239cd;
}

SCSS

$color-1: #96b1c9;
$color-2: #85cbee;
$color-3: #0ba6da;
$color-4: #2381cf;
$color-5: #3239cd;

TAILWIND

colors: {
  'brand-1': '#96b1c9',
  'brand-2': '#85cbee',
  'brand-3': '#0ba6da',
  'brand-4': '#2381cf',
  'brand-5': '#3239cd',
}

RGB Array

[150, 177, 201], [133, 203, 238], [11, 166, 218], [35, 129, 207], [50, 57, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #96B1C9, #85CBEE, #0BA6DA, #2381CF, #3239CD is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #96b1c9; --color-2: #85cbee; --color-3: #0ba6da; --color-4: #2381cf; --color-5: #3239cd. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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