← Back to Editor

#C5CCD4 · #010E14 · #3C2908 · #8D660B · #90ABBE

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 LibraryData Visualization

Color Details Color Details

#C5CCD4

Azure · LightGray · Cobalt Blue

HEX
#C5CCD4
RGB
rgb(197, 204, 212)
HSL
hsl(212, 15%, 80%)
HSB
hsb(212, 7%, 83%)
CMYK
cmyk(7%, 4%, 0%, 17%)
Oklch
oklch(84.2% 0.014 251.6)

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

#010E14

Lake Blue · Black · Peacock Green

HEX
#010E14
RGB
rgb(1, 14, 20)
HSL
hsl(199, 90%, 4%)
HSB
hsb(199, 95%, 8%)
CMYK
cmyk(95%, 30%, 0%, 92%)
Oklch
oklch(15.3% 0.026 224.5)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#3C2908

Ochre · Black · Cinnamon

HEX
#3C2908
RGB
rgb(60, 41, 8)
HSL
hsl(38, 76%, 13%)
HSB
hsb(38, 87%, 24%)
CMYK
cmyk(0%, 32%, 87%, 76%)
Oklch
oklch(29.7% 0.054 77.2)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#8D660B

Ochre · Olive · Honey Gold

HEX
#8D660B
RGB
rgb(141, 102, 11)
HSL
hsl(42, 86%, 30%)
HSB
hsb(42, 92%, 55%)
CMYK
cmyk(0%, 28%, 92%, 45%)
Oklch
oklch(53.7% 0.107 81.3)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#90ABBE

Sky Blue · DarkGray · Cobalt Blue

HEX
#90ABBE
RGB
rgb(144, 171, 190)
HSL
hsl(205, 26%, 65%)
HSB
hsb(205, 24%, 75%)
CMYK
cmyk(24%, 10%, 0%, 25%)
Oklch
oklch(72.7% 0.041 238.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C5CCD4
D4CDC4

Analogous

C4D3D4
C5CCD4
C5C4D4

Triadic

C5CCD4
D4C4CB
CBD4C4

Split-Comp.

C5CCD4
D4C5C4
D3D4C4

Tetradic

C5CCD4
D4C4D3
D4CDC4
C4D4C5

Contrast Matrix WCAG 2.1 Contrast

C5CCD4
010E14
3C2908
8D660B
90ABBE
—
12.1
AAA
8.6
AAA
3.2
AA Large
1.5
Fail
12.1
AAA
—
1.4
Fail
3.8
AA Large
8.1
AAA
8.6
AAA
1.4
Fail
—
2.7
Fail
5.8
AA
3.2
AA Large
3.8
AA Large
2.7
Fail
—
2.2
Fail
1.5
Fail
8.1
AAA
5.8
AA
2.2
Fail
—
White BG
1.6Fail
19.5AAA
13.9AAA
5.2AA
2.4Fail
Black BG
13.0AAA
1.1Fail
1.5Fail
4.0AA Large
8.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C8D2
070713
343410
7C7C21
9C9CB9

Deuteranopia

C8C7D2
060512
353612
7E8126
9A98B8

Tritanopia

C5D1D0
021111
3B1618
8B3236
91B6B5

Achromatopsia

CBCBCB
0B0B0B
2B2B2B
676767
A5A5A5

Shades & Tints Shades & Tints

#C5CCD4

Dark
Light

#010E14

Dark
Light

#3C2908

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c5ccd4;
  --color-2: #010e14;
  --color-3: #3c2908;
  --color-4: #8d660b;
  --color-5: #90abbe;
}

SCSS

$color-1: #c5ccd4;
$color-2: #010e14;
$color-3: #3c2908;
$color-4: #8d660b;
$color-5: #90abbe;

TAILWIND

colors: {
  'brand-1': '#c5ccd4',
  'brand-2': '#010e14',
  'brand-3': '#3c2908',
  'brand-4': '#8d660b',
  'brand-5': '#90abbe',
}

RGB Array

[197, 204, 212], [1, 14, 20], [60, 41, 8], [141, 102, 11], [144, 171, 190]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C5CCD4, #010E14, #3C2908, #8D660B, #90ABBE is ideal for: tech websites, dark mode UIs, game UIs, 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: #c5ccd4; --color-2: #010e14; --color-3: #3c2908; --color-4: #8d660b; --color-5: #90abbe. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 general-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