← Back to Editor

#2A485C · #1D6391 · #94B9D1 · #FFFFFF · #0A2436

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

#2A485C

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#2A485C
RGB
rgb(42, 72, 92)
HSL
hsl(204, 37%, 26%)
HSB
hsb(204, 54%, 36%)
CMYK
cmyk(54%, 22%, 0%, 64%)
Oklch
oklch(38.7% 0.050 239.0)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#1D6391

Lake Blue · Teal · Prussian Blue

HEX
#1D6391
RGB
rgb(29, 99, 145)
HSL
hsl(204, 67%, 34%)
HSB
hsb(204, 80%, 57%)
CMYK
cmyk(80%, 32%, 0%, 43%)
Oklch
oklch(48.0% 0.100 242.5)

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

#94B9D1

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#94B9D1
RGB
rgb(148, 185, 209)
HSL
hsl(204, 40%, 70%)
HSB
hsb(204, 29%, 82%)
CMYK
cmyk(29%, 11%, 0%, 18%)
Oklch
oklch(76.7% 0.053 236.8)

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

#FFFFFF

Moonlight White · White · Cloud White

HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
HSB
hsb(0, 0%, 100%)
CMYK
cmyk(0%, 0%, 0%, 0%)
Oklch
oklch(100.0% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

#0A2436

Lake Blue · MidnightBlue · Deep Sea Blue

HEX
#0A2436
RGB
rgb(10, 36, 54)
HSL
hsl(205, 69%, 13%)
HSB
hsb(205, 81%, 21%)
CMYK
cmyk(81%, 33%, 0%, 79%)
Oklch
oklch(25.0% 0.047 242.2)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A485C
5B3D2A

Analogous

2A5B56
2A485C
2A2F5B

Triadic

2A485C
5B2A47
475B2A

Split-Comp.

2A485C
5B2A2F
5B562A

Tetradic

2A485C
562A5B
5B3D2A
2F5B2A

Contrast Matrix WCAG 2.1 Contrast

2A485C
1D6391
94B9D1
FFFFFF
0A2436
—
1.5
Fail
4.6
AA
9.6
AAA
1.7
Fail
1.5
Fail
—
3.1
AA Large
6.5
AA
2.5
Fail
4.6
AA
3.1
AA Large
—
2.1
Fail
7.7
AAA
9.6
AAA
6.5
AA
2.1
Fail
—
15.9
AAA
1.7
Fail
2.5
Fail
7.7
AAA
15.9
AAA
—
White BG
9.6AAA
6.5AA
2.1Fail
1.0Fail
15.9AAA
Black BG
2.2Fail
3.2AA Large
10.1AAA
21.0AAA
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

373757
3B3C86
A4A4CB
FFFFFF
151532

Deuteranopia

353356
373283
A29FCA
FFFFFF
141231

Tritanopia

2C5353
217D7B
96C7C6
FFFFFF
0B2E2D

Achromatopsia

414141
535353
B1B1B1
FFFFFF
1E1E1E

Shades & Tints Shades & Tints

#2A485C

Dark
Light

#1D6391

Dark
Light

#94B9D1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a485c;
  --color-2: #1d6391;
  --color-3: #94b9d1;
  --color-4: #ffffff;
  --color-5: #0a2436;
}

SCSS

$color-1: #2a485c;
$color-2: #1d6391;
$color-3: #94b9d1;
$color-4: #ffffff;
$color-5: #0a2436;

TAILWIND

colors: {
  'brand-1': '#2a485c',
  'brand-2': '#1d6391',
  'brand-3': '#94b9d1',
  'brand-4': '#ffffff',
  'brand-5': '#0a2436',
}

RGB Array

[42, 72, 92], [29, 99, 145], [148, 185, 209], [255, 255, 255], [10, 36, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A485C, #1D6391, #94B9D1, #FFFFFF, #0A2436 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: #2a485c; --color-2: #1d6391; --color-3: #94b9d1; --color-4: #ffffff; --color-5: #0a2436. 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