← Back to Editor

#606E71 · #C6A18E · #C3BFBC · #D1D9DC · #E8E8E0

warm

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

#606E71

Slate Blue · DimGray · Warm Gray

HEX
#606E71
RGB
rgb(96, 110, 113)
HSL
hsl(191, 8%, 41%)
HSB
hsb(191, 15%, 44%)
CMYK
cmyk(15%, 3%, 0%, 56%)
Oklch
oklch(52.8% 0.018 212.1)

Traditional「Slate Blue」· Paint「Warm Gray」· Creative Urban Concrete

#C6A18E

Apricot · Tan · Warm Sun

HEX
#C6A18E
RGB
rgb(198, 161, 142)
HSL
hsl(20, 33%, 67%)
HSB
hsb(20, 28%, 78%)
CMYK
cmyk(0%, 19%, 28%, 22%)
Oklch
oklch(73.8% 0.052 48.7)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#C3BFBC

Silver Gray · Silver · Pearl Gray

HEX
#C3BFBC
RGB
rgb(195, 191, 188)
HSL
hsl(26, 6%, 75%)
HSB
hsb(26, 4%, 76%)
CMYK
cmyk(0%, 2%, 4%, 24%)
Oklch
oklch(80.7% 0.006 59.6)

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

#D1D9DC

Sky Blue · LightGray · Glacier Blue

HEX
#D1D9DC
RGB
rgb(209, 217, 220)
HSL
hsl(196, 14%, 84%)
HSB
hsb(196, 5%, 86%)
CMYK
cmyk(5%, 1%, 0%, 14%)
Oklch
oklch(88.0% 0.010 222.1)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#E8E8E0

Fresh Green · Beige · Lemon Cream

HEX
#E8E8E0
RGB
rgb(232, 232, 224)
HSL
hsl(60, 15%, 89%)
HSB
hsb(60, 3%, 91%)
CMYK
cmyk(0%, 0%, 3%, 9%)
Oklch
oklch(92.9% 0.011 106.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

606E71
716360

Analogous

60716C
606E71
606571

Triadic

606E71
71606E
6E7160

Split-Comp.

606E71
716065
716C60

Tetradic

606E71
6C6071
716360
657160

Contrast Matrix WCAG 2.1 Contrast

606E71
C6A18E
C3BFBC
D1D9DC
E8E8E0
—
2.2
Fail
2.9
Fail
3.7
AA Large
4.3
AA Large
2.2
Fail
—
1.3
Fail
1.7
Fail
1.9
Fail
2.9
Fail
1.3
Fail
—
1.3
Fail
1.5
Fail
3.7
AA Large
1.7
Fail
1.3
Fail
—
1.2
Fail
4.3
AA Large
1.9
Fail
1.5
Fail
1.2
Fail
—
White BG
5.3AA
2.4Fail
1.8Fail
1.4Fail
1.2Fail
Black BG
4.0AA Large
8.9AAA
11.5AAA
14.7AAA
17.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

666670
B6B693
C1C1BD
D4D5DB
E8E8E2

Deuteranopia

656470
B8BB94
C2C2BD
D4D3DB
E8E8E2

Tritanopia

617070
C49697
C3BDBD
D1DBDB
E8E3E4

Achromatopsia

6A6A6A
AAAAAA
C0C0C0
D7D7D7
E7E7E7

Shades & Tints Shades & Tints

#606E71

Dark
Light

#C6A18E

Dark
Light

#C3BFBC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #606e71;
  --color-2: #c6a18e;
  --color-3: #c3bfbc;
  --color-4: #d1d9dc;
  --color-5: #e8e8e0;
}

SCSS

$color-1: #606e71;
$color-2: #c6a18e;
$color-3: #c3bfbc;
$color-4: #d1d9dc;
$color-5: #e8e8e0;

TAILWIND

colors: {
  'brand-1': '#606e71',
  'brand-2': '#c6a18e',
  'brand-3': '#c3bfbc',
  'brand-4': '#d1d9dc',
  'brand-5': '#e8e8e0',
}

RGB Array

[96, 110, 113], [198, 161, 142], [195, 191, 188], [209, 217, 220], [232, 232, 224]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #606E71, #C6A18E, #C3BFBC, #D1D9DC, #E8E8E0 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #606e71; --color-2: #c6a18e; --color-3: #c3bfbc; --color-4: #d1d9dc; --color-5: #e8e8e0. 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 warm-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