← Back to Editor

#C1C9C9 · #D3D4DB · #E5E4EB · #EDEDED · #E6E6E8

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C1C9C9

Silver Gray · Silver · Pearl Gray

HEX
#C1C9C9
RGB
rgb(193, 201, 201)
HSL
hsl(180, 7%, 77%)
HSB
hsb(180, 4%, 79%)
CMYK
cmyk(4%, 0%, 0%, 21%)
Oklch
oklch(83.0% 0.009 197.0)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#D3D4DB

Azure · LightGray · Sky Blue

HEX
#D3D4DB
RGB
rgb(211, 212, 219)
HSL
hsl(232, 10%, 84%)
HSB
hsb(232, 4%, 86%)
CMYK
cmyk(4%, 3%, 0%, 14%)
Oklch
oklch(87.1% 0.010 279.7)

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

#E5E4EB

Wisteria · Lavender · Sky Blue

HEX
#E5E4EB
RGB
rgb(229, 228, 235)
HSL
hsl(249, 15%, 91%)
HSB
hsb(249, 3%, 92%)
CMYK
cmyk(3%, 3%, 0%, 8%)
Oklch
oklch(92.2% 0.009 292.8)

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

#EDEDED

Plain White · Linen · Cloud White

HEX
#EDEDED
RGB
rgb(237, 237, 237)
HSL
hsl(0, 0%, 93%)
HSB
hsb(0, 0%, 93%)
CMYK
cmyk(0%, 0%, 0%, 7%)
Oklch
oklch(94.6% 0.000 89.9)

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

#E6E6E8

Plain White · Lavender · Cloud White

HEX
#E6E6E8
RGB
rgb(230, 230, 232)
HSL
hsl(240, 4%, 91%)
HSB
hsb(240, 1%, 91%)
CMYK
cmyk(1%, 1%, 0%, 9%)
Oklch
oklch(92.6% 0.003 286.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C1C9C9
C8C0C0

Analogous

C0C8C4
C1C9C9
C0C4C8

Triadic

C1C9C9
C8C0C8
C8C8C0

Split-Comp.

C1C9C9
C8C0C4
C8C4C0

Tetradic

C1C9C9
C4C0C8
C8C0C0
C4C8C0

Contrast Matrix WCAG 2.1 Contrast

C1C9C9
D3D4DB
E5E4EB
EDEDED
E6E6E8
—
1.1
Fail
1.3
Fail
1.4
Fail
1.4
Fail
1.1
Fail
—
1.2
Fail
1.3
Fail
1.2
Fail
1.3
Fail
1.2
Fail
—
1.1
Fail
1.0
Fail
1.4
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.2
Fail
1.0
Fail
1.1
Fail
—
White BG
1.7Fail
1.5Fail
1.3Fail
1.2Fail
1.2Fail
Black BG
12.5AAA
14.2AAA
16.6AAA
17.9AAA
16.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C4C5C9
D3D3D9
E5E5E9
EDEDED
E6E6E8

Deuteranopia

C4C3C9
D3D3D9
E5E5E9
EDEDED
E6E6E7

Tritanopia

C1C9C9
D3D8D8
E5E8E8
EDEDED
E6E7E7

Achromatopsia

C7C7C7
D4D4D4
E5E5E5
EDEDED
E6E6E6

Shades & Tints Shades & Tints

#C1C9C9

Dark
Light

#D3D4DB

Dark
Light

#E5E4EB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c1c9c9;
  --color-2: #d3d4db;
  --color-3: #e5e4eb;
  --color-4: #ededed;
  --color-5: #e6e6e8;
}

SCSS

$color-1: #c1c9c9;
$color-2: #d3d4db;
$color-3: #e5e4eb;
$color-4: #ededed;
$color-5: #e6e6e8;

TAILWIND

colors: {
  'brand-1': '#c1c9c9',
  'brand-2': '#d3d4db',
  'brand-3': '#e5e4eb',
  'brand-4': '#ededed',
  'brand-5': '#e6e6e8',
}

RGB Array

[193, 201, 201], [211, 212, 219], [229, 228, 235], [237, 237, 237], [230, 230, 232]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C1C9C9, #D3D4DB, #E5E4EB, #EDEDED, #E6E6E8 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. 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: #c1c9c9; --color-2: #d3d4db; --color-3: #e5e4eb; --color-4: #ededed; --color-5: #e6e6e8. 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. 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 beauty, lifestyle, arts 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