← Back to Editor

#2364B9 · #838993 · #9D9A9B · #ACAFA5 · #C1C0B0

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 Library

Color Details Color Details

#2364B9

Indigo · SteelBlue · Navy Blue

HEX
#2364B9
RGB
rgb(35, 100, 185)
HSL
hsl(214, 68%, 43%)
HSB
hsb(214, 81%, 73%)
CMYK
cmyk(81%, 46%, 0%, 27%)
Oklch
oklch(50.9% 0.149 256.8)

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

#838993

Ash · LightSlateGray · Warm Gray

HEX
#838993
RGB
rgb(131, 137, 147)
HSL
hsl(218, 7%, 55%)
HSB
hsb(218, 11%, 58%)
CMYK
cmyk(11%, 7%, 0%, 42%)
Oklch
oklch(62.8% 0.017 260.7)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#9D9A9B

Ash · DarkGray · Silver Sand

HEX
#9D9A9B
RGB
rgb(157, 154, 155)
HSL
hsl(340, 2%, 61%)
HSB
hsb(340, 2%, 62%)
CMYK
cmyk(0%, 2%, 1%, 38%)
Oklch
oklch(68.9% 0.004 354.7)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#ACAFA5

Ash · DarkGray · Silver Sand

HEX
#ACAFA5
RGB
rgb(172, 175, 165)
HSL
hsl(78, 6%, 67%)
HSB
hsb(78, 6%, 69%)
CMYK
cmyk(2%, 0%, 6%, 31%)
Oklch
oklch(74.9% 0.014 120.4)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#C1C0B0

Fresh Green · Silver · Sunflower

HEX
#C1C0B0
RGB
rgb(193, 192, 176)
HSL
hsl(56, 12%, 72%)
HSB
hsb(56, 9%, 76%)
CMYK
cmyk(0%, 1%, 9%, 24%)
Oklch
oklch(80.4% 0.022 104.0)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2364B9
B87823

Analogous

23AEB8
2364B9
2D23B8

Triadic

2364B9
B82364
64B823

Split-Comp.

2364B9
B82D23
AEB823

Tetradic

2364B9
B823AE
B87823
23B82D

Contrast Matrix WCAG 2.1 Contrast

2364B9
838993
9D9A9B
ACAFA5
C1C0B0
—
1.7
Fail
2.1
Fail
2.6
Fail
3.2
AA Large
1.7
Fail
—
1.3
Fail
1.6
Fail
1.9
Fail
2.1
Fail
1.3
Fail
—
1.3
Fail
1.5
Fail
2.6
Fail
1.6
Fail
1.3
Fail
—
1.2
Fail
3.2
AA Large
1.9
Fail
1.5
Fail
1.2
Fail
—
White BG
5.8AA
3.5AA Large
2.8Fail
2.2Fail
1.8Fail
Black BG
3.6AA Large
6.0AA
7.5AAA
9.4AAA
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3F40A4
868691
9C9C9B
ADADA7
C1C1B4

Deuteranopia

3B37A0
858590
9C9C9B
ADADA8
C1C1B5

Tritanopia

269491
838F8E
9D9B9B
ACA9AA
C1B7B8

Achromatopsia

5A5A5A
888888
9B9B9B
ADADAD
BEBEBE

Shades & Tints Shades & Tints

#2364B9

Dark
Light

#838993

Dark
Light

#9D9A9B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2364b9;
  --color-2: #838993;
  --color-3: #9d9a9b;
  --color-4: #acafa5;
  --color-5: #c1c0b0;
}

SCSS

$color-1: #2364b9;
$color-2: #838993;
$color-3: #9d9a9b;
$color-4: #acafa5;
$color-5: #c1c0b0;

TAILWIND

colors: {
  'brand-1': '#2364b9',
  'brand-2': '#838993',
  'brand-3': '#9d9a9b',
  'brand-4': '#acafa5',
  'brand-5': '#c1c0b0',
}

RGB Array

[35, 100, 185], [131, 137, 147], [157, 154, 155], [172, 175, 165], [193, 192, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2364B9, #838993, #9D9A9B, #ACAFA5, #C1C0B0 is ideal for: brand design, premium product pages, magazine layouts. 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: #2364b9; --color-2: #838993; --color-3: #9d9a9b; --color-4: #acafa5; --color-5: #c1c0b0. 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 tech, SaaS, healthcare, eco 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