← Back to Editor

#C9CACF · #9CA3A9 · #64635E · #E3571A · #F39F1B

warm

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

#C9CACF

Silver Gray · LightGray · Pearl Gray

HEX
#C9CACF
RGB
rgb(201, 202, 207)
HSL
hsl(230, 6%, 80%)
HSB
hsb(230, 3%, 81%)
CMYK
cmyk(3%, 2%, 0%, 19%)
Oklch
oklch(84.0% 0.007 277.1)

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

#9CA3A9

Ash · DarkGray · Silver Sand

HEX
#9CA3A9
RGB
rgb(156, 163, 169)
HSL
hsl(208, 7%, 64%)
HSB
hsb(208, 8%, 66%)
CMYK
cmyk(8%, 4%, 0%, 34%)
Oklch
oklch(71.2% 0.012 243.7)

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

#64635E

Ink Gray · DimGray · Charcoal

HEX
#64635E
RGB
rgb(100, 99, 94)
HSL
hsl(50, 3%, 38%)
HSB
hsb(50, 6%, 39%)
CMYK
cmyk(0%, 1%, 6%, 61%)
Oklch
oklch(49.9% 0.008 97.5)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#E3571A

Tangerine · Chocolate · Amber Brown

HEX
#E3571A
RGB
rgb(227, 87, 26)
HSL
hsl(18, 79%, 50%)
HSB
hsb(18, 89%, 89%)
CMYK
cmyk(0%, 62%, 89%, 11%)
Oklch
oklch(63.4% 0.187 40.2)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#F39F1B

Ginger · GoldenRod · Warm Sun

HEX
#F39F1B
RGB
rgb(243, 159, 27)
HSL
hsl(37, 90%, 53%)
HSB
hsb(37, 89%, 95%)
CMYK
cmyk(0%, 35%, 89%, 5%)
Oklch
oklch(76.8% 0.160 70.4)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9CACF
CFCEC9

Analogous

C9CDCF
C9CACF
CBC9CF

Triadic

C9CACF
CFC9CA
CACFC9

Split-Comp.

C9CACF
CFCBC9
CDCFC9

Tetradic

C9CACF
CFC9CD
CFCEC9
C9CFCB

Contrast Matrix WCAG 2.1 Contrast

C9CACF
9CA3A9
64635E
E3571A
F39F1B
—
1.6
Fail
3.7
AA Large
2.3
Fail
1.3
Fail
1.6
Fail
—
2.4
Fail
1.5
Fail
1.2
Fail
3.7
AA Large
2.4
Fail
—
1.6
Fail
2.8
Fail
2.3
Fail
1.5
Fail
1.6
Fail
—
1.7
Fail
1.3
Fail
1.2
Fail
2.8
Fail
1.7
Fail
—
White BG
1.6Fail
2.6Fail
6.0AA
3.7AA Large
2.1Fail
Black BG
12.8AAA
8.2AAA
3.5AA Large
5.6AA
9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C9CE
9F9FA8
64645F
A6A529
CFCE3B

Deuteranopia

C9C9CD
9F9EA7
646460
AFB92C
D4DA43

Tritanopia

C9CDCD
9CA6A6
646060
DC3437
EF545A

Achromatopsia

CACACA
A2A2A2
636363
7A7A7A
A9A9A9

Shades & Tints Shades & Tints

#C9CACF

Dark
Light

#9CA3A9

Dark
Light

#64635E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9cacf;
  --color-2: #9ca3a9;
  --color-3: #64635e;
  --color-4: #e3571a;
  --color-5: #f39f1b;
}

SCSS

$color-1: #c9cacf;
$color-2: #9ca3a9;
$color-3: #64635e;
$color-4: #e3571a;
$color-5: #f39f1b;

TAILWIND

colors: {
  'brand-1': '#c9cacf',
  'brand-2': '#9ca3a9',
  'brand-3': '#64635e',
  'brand-4': '#e3571a',
  'brand-5': '#f39f1b',
}

RGB Array

[201, 202, 207], [156, 163, 169], [100, 99, 94], [227, 87, 26], [243, 159, 27]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #C9CACF, #9CA3A9, #64635E, #E3571A, #F39F1B 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: #c9cacf; --color-2: #9ca3a9; --color-3: #64635e; --color-4: #e3571a; --color-5: #f39f1b. 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 warm-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