← Back to Editor

#0D2B35 · #415556 · #8D4302 · #8A651E · #B09B6E

cool

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

#0D2B35

Lake Blue · DarkSlateGray · Peacock Green

HEX
#0D2B35
RGB
rgb(13, 43, 53)
HSL
hsl(195, 61%, 13%)
HSB
hsb(195, 75%, 21%)
CMYK
cmyk(75%, 19%, 0%, 79%)
Oklch
oklch(27.2% 0.040 223.2)

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

#415556

Slate Blue · DarkSlateGray · Mint Ice

HEX
#415556
RGB
rgb(65, 85, 86)
HSL
hsl(183, 14%, 30%)
HSB
hsb(183, 24%, 34%)
CMYK
cmyk(24%, 1%, 0%, 66%)
Oklch
oklch(43.3% 0.025 200.1)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8D4302

Tangerine · Sienna · Amber Brown

HEX
#8D4302
RGB
rgb(141, 67, 2)
HSL
hsl(28, 97%, 28%)
HSB
hsb(28, 99%, 55%)
CMYK
cmyk(0%, 52%, 99%, 45%)
Oklch
oklch(47.0% 0.120 52.0)

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

#8A651E

Ochre · Sienna · Amber Brown

HEX
#8A651E
RGB
rgb(138, 101, 30)
HSL
hsl(39, 64%, 33%)
HSB
hsb(39, 78%, 54%)
CMYK
cmyk(0%, 27%, 78%, 46%)
Oklch
oklch(53.2% 0.097 79.5)

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

#B09B6E

Ginger · Tan · Sunflower

HEX
#B09B6E
RGB
rgb(176, 155, 110)
HSL
hsl(41, 29%, 56%)
HSB
hsb(41, 37%, 69%)
CMYK
cmyk(0%, 12%, 37%, 31%)
Oklch
oklch(69.7% 0.066 85.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0D2B35
35170D

Analogous

0D352B
0D2B35
0D1735

Triadic

0D2B35
350D2B
2B350D

Split-Comp.

0D2B35
350D17
352B0D

Tetradic

0D2B35
2B0D35
35170D
17350D

Contrast Matrix WCAG 2.1 Contrast

0D2B35
415556
8D4302
8A651E
B09B6E
—
1.9
Fail
2.1
Fail
2.8
Fail
5.5
AA
1.9
Fail
—
1.1
Fail
1.5
Fail
2.9
Fail
2.1
Fail
1.1
Fail
—
1.3
Fail
2.6
Fail
2.8
Fail
1.5
Fail
1.3
Fail
—
2.0
Fail
5.5
AA
2.9
Fail
2.6
Fail
2.0
Fail
—
White BG
14.9AAA
7.9AAA
7.2AAA
5.3AA
2.7Fail
Black BG
1.4Fail
2.7Fail
2.9Fail
4.0AA Large
7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1A1A33
4A4A56
6D6C12
7A7A2F
A7A779

Deuteranopia

181632
494756
717715
7C7F33
A8AA7C

Tritanopia

0F3130
425656
891E21
883D40
AF8183

Achromatopsia

232323
4F4F4F
525252
686868
9C9C9C

Shades & Tints Shades & Tints

#0D2B35

Dark
Light

#415556

Dark
Light

#8D4302

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0d2b35;
  --color-2: #415556;
  --color-3: #8d4302;
  --color-4: #8a651e;
  --color-5: #b09b6e;
}

SCSS

$color-1: #0d2b35;
$color-2: #415556;
$color-3: #8d4302;
$color-4: #8a651e;
$color-5: #b09b6e;

TAILWIND

colors: {
  'brand-1': '#0d2b35',
  'brand-2': '#415556',
  'brand-3': '#8d4302',
  'brand-4': '#8a651e',
  'brand-5': '#b09b6e',
}

RGB Array

[13, 43, 53], [65, 85, 86], [141, 67, 2], [138, 101, 30], [176, 155, 110]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #0D2B35, #415556, #8D4302, #8A651E, #B09B6E 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: #0d2b35; --color-2: #415556; --color-3: #8d4302; --color-4: #8a651e; --color-5: #b09b6e. 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 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