← Back to Editor

#401026 · #646A8C · #BEBAD9 · #F2DCE6 · #F2F2F2

cool

A 5-color cool 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

#401026

Dark Violet · Black · Raspberry

HEX
#401026
RGB
rgb(64, 16, 38)
HSL
hsl(333, 60%, 16%)
HSB
hsb(333, 75%, 25%)
CMYK
cmyk(0%, 75%, 41%, 75%)
Oklch
oklch(26.2% 0.078 355.6)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#646A8C

Indigo · SlateGray · Navy Blue

HEX
#646A8C
RGB
rgb(100, 106, 140)
HSL
hsl(231, 17%, 47%)
HSB
hsb(231, 29%, 55%)
CMYK
cmyk(29%, 24%, 0%, 45%)
Oklch
oklch(53.2% 0.054 276.6)

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

#BEBAD9

Wisteria · LightSteelBlue · Cobalt Blue

HEX
#BEBAD9
RGB
rgb(190, 186, 217)
HSL
hsl(248, 29%, 79%)
HSB
hsb(248, 14%, 85%)
CMYK
cmyk(12%, 14%, 0%, 15%)
Oklch
oklch(80.2% 0.044 291.3)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#F2DCE6

Rouge · Linen · Cherry Blossom

HEX
#F2DCE6
RGB
rgb(242, 220, 230)
HSL
hsl(333, 46%, 91%)
HSB
hsb(333, 9%, 95%)
CMYK
cmyk(0%, 9%, 5%, 5%)
Oklch
oklch(91.5% 0.027 348.4)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#F2F2F2

Plain White · SeaShell · Cloud White

HEX
#F2F2F2
RGB
rgb(242, 242, 242)
HSL
hsl(0, 0%, 95%)
HSB
hsb(0, 0%, 95%)
CMYK
cmyk(0%, 0%, 0%, 5%)
Oklch
oklch(96.1% 0.000 89.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

401026
10412B

Analogous

41103F
401026
411310

Triadic

401026
264110
102641

Split-Comp.

401026
104113
103F41

Tetradic

401026
3F4110
10412B
131041

Contrast Matrix WCAG 2.1 Contrast

401026
646A8C
BEBAD9
F2DCE6
F2F2F2
—
3.0
AA Large
8.5
AAA
12.2
AAA
14.2
AAA
3.0
AA Large
—
2.8
Fail
4.1
AA Large
4.7
AA
8.5
AAA
2.8
Fail
—
1.4
Fail
1.7
Fail
12.2
AAA
4.1
AA Large
1.4
Fail
—
1.2
Fail
14.2
AAA
4.7
AA
1.7
Fail
1.2
Fail
—
White BG
15.9AAA
5.3AA
1.9Fail
1.3Fail
1.1Fail
Black BG
1.3Fail
4.0AA Large
11.2AAA
16.2AAA
18.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2B21
676784
BCBCD1
E8E8E4
F2F2F2

Deuteranopia

2E321F
666682
BDBDD0
EAEBE3
F2F2F2

Tritanopia

3E1C1C
647D7C
BECCCA
F1E2E1
F2F2F2

Achromatopsia

212121
6C6C6C
BFBFBF
E4E4E4
F2F2F2

Shades & Tints Shades & Tints

#401026

Dark
Light

#646A8C

Dark
Light

#BEBAD9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #401026;
  --color-2: #646a8c;
  --color-3: #bebad9;
  --color-4: #f2dce6;
  --color-5: #f2f2f2;
}

SCSS

$color-1: #401026;
$color-2: #646a8c;
$color-3: #bebad9;
$color-4: #f2dce6;
$color-5: #f2f2f2;

TAILWIND

colors: {
  'brand-1': '#401026',
  'brand-2': '#646a8c',
  'brand-3': '#bebad9',
  'brand-4': '#f2dce6',
  'brand-5': '#f2f2f2',
}

RGB Array

[64, 16, 38], [100, 106, 140], [190, 186, 217], [242, 220, 230], [242, 242, 242]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #401026, #646A8C, #BEBAD9, #F2DCE6, #F2F2F2 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: #401026; --color-2: #646a8c; --color-3: #bebad9; --color-4: #f2dce6; --color-5: #f2f2f2. 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 cool-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