← Back to Editor

#426195 · #5AA0C0 · #95D1DA · #F3F8F3 · #F11E58

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#426195

Indigo · DarkSlateBlue · Navy Blue

HEX
#426195
RGB
rgb(66, 97, 149)
HSL
hsl(218, 39%, 42%)
HSB
hsb(218, 56%, 58%)
CMYK
cmyk(56%, 35%, 0%, 42%)
Oklch
oklch(49.3% 0.092 260.3)

TraditionalIndigo」· PaintNavy Blue」· Creative Blush Sunrise

#5AA0C0

Slate Blue · CadetBlue · Lake Green

HEX
#5AA0C0
RGB
rgb(90, 160, 192)
HSL
hsl(199, 45%, 55%)
HSB
hsb(199, 53%, 75%)
CMYK
cmyk(53%, 17%, 0%, 25%)
Oklch
oklch(67.2% 0.085 229.5)

TraditionalSlate Blue」· PaintLake Green」· Creative Blush Sunrise

#95D1DA

Sky Blue · SkyBlue · Lake Green

HEX
#95D1DA
RGB
rgb(149, 209, 218)
HSL
hsl(188, 48%, 72%)
HSB
hsb(188, 32%, 85%)
CMYK
cmyk(32%, 4%, 0%, 15%)
Oklch
oklch(82.3% 0.062 207.7)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#F3F8F3

Celadon · SeaShell · Mint Green

HEX
#F3F8F3
RGB
rgb(243, 248, 243)
HSL
hsl(120, 26%, 96%)
HSB
hsb(120, 2%, 97%)
CMYK
cmyk(2%, 0%, 2%, 3%)
Oklch
oklch(97.4% 0.008 145.5)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#F11E58

Dark Violet · Crimson · Rose Pink

HEX
#F11E58
RGB
rgb(241, 30, 88)
HSL
hsl(344, 88%, 53%)
HSB
hsb(344, 88%, 95%)
CMYK
cmyk(0%, 88%, 63%, 5%)
Oklch
oklch(61.8% 0.235 14.3)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

426195
957641

Analogous

418A95
426195
4C4195

Triadic

426195
954160
609541

Split-Comp.

426195
954C41
8A9541

Tetradic

426195
95418A
957641
41954C

Contrast Matrix WCAG 2.1 Contrast

426195
5AA0C0
95D1DA
F3F8F3
F11E58
2.1
Fail
3.7
AA Large
5.8
AA
1.5
Fail
2.1
Fail
1.7
Fail
2.7
Fail
1.4
Fail
3.7
AA Large
1.7
Fail
1.6
Fail
2.4
Fail
5.8
AA
2.7
Fail
1.6
Fail
3.9
AA Large
1.5
Fail
1.4
Fail
2.4
Fail
3.9
AA Large
White BG
6.2AA
2.9Fail
1.7Fail
1.1Fail
4.1AA Large
Black BG
3.4AA Large
7.2AAA
12.4AAA
19.5AAA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F5088
7879B8
AFB0D8
F5F5F4
96944A

Deuteranopia

4E4B85
746FB6
ACA7D7
F5F5F5
A2B247

Tritanopia

447E7C
5EB2B1
98D6D6
F3F5F5
E63F3C

Achromatopsia

5E5E5E
8F8F8F
C0C0C0
F6F6F6
646464

Shades & Tints Shades & Tints

#426195

Dark
Light

#5AA0C0

Dark
Light

#95D1DA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #426195;
  --color-2: #5aa0c0;
  --color-3: #95d1da;
  --color-4: #f3f8f3;
  --color-5: #f11e58;
}

SCSS

$color-1: #426195;
$color-2: #5aa0c0;
$color-3: #95d1da;
$color-4: #f3f8f3;
$color-5: #f11e58;

TAILWIND

colors: {
  'brand-1': '#426195',
  'brand-2': '#5aa0c0',
  'brand-3': '#95d1da',
  'brand-4': '#f3f8f3',
  'brand-5': '#f11e58',
}

RGB Array

[66, 97, 149], [90, 160, 192], [149, 209, 218], [243, 248, 243], [241, 30, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #426195, #5AA0C0, #95D1DA, #F3F8F3, #F11E58 is ideal for: 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: #426195; --color-2: #5aa0c0; --color-3: #95d1da; --color-4: #f3f8f3; --color-5: #f11e58. 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. 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