← Back to Editor

#645E2C · #69917C · #384D5A · #BD5B3E · #4D4253

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#645E2C

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#645E2C
RGB
rgb(100, 94, 44)
HSL
hsl(54, 39%, 28%)
HSB
hsb(54, 56%, 39%)
CMYK
cmyk(0%, 6%, 56%, 61%)
Oklch
oklch(47.6% 0.070 102.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#69917C

Celadon · SlateGray · Olive Green

HEX
#69917C
RGB
rgb(105, 145, 124)
HSL
hsl(149, 16%, 49%)
HSB
hsb(149, 28%, 57%)
CMYK
cmyk(28%, 0%, 14%, 43%)
Oklch
oklch(62.1% 0.054 161.4)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#384D5A

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#384D5A
RGB
rgb(56, 77, 90)
HSL
hsl(203, 23%, 29%)
HSB
hsb(203, 38%, 35%)
CMYK
cmyk(38%, 14%, 0%, 65%)
Oklch
oklch(40.8% 0.034 235.9)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#BD5B3E

Crimson · Sienna · Passion Red

HEX
#BD5B3E
RGB
rgb(189, 91, 62)
HSL
hsl(14, 51%, 49%)
HSB
hsb(14, 67%, 74%)
CMYK
cmyk(0%, 52%, 67%, 26%)
Oklch
oklch(58.5% 0.134 37.2)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#4D4253

Dark Plum · DarkSlateGray · Eggplant

HEX
#4D4253
RGB
rgb(77, 66, 83)
HSL
hsl(279, 11%, 29%)
HSB
hsb(279, 20%, 33%)
CMYK
cmyk(7%, 20%, 0%, 67%)
Oklch
oklch(39.7% 0.031 313.7)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

645E2C
2C3163

Analogous

63422C
645E2C
4D632C

Triadic

645E2C
2C635E
5E2C63

Split-Comp.

645E2C
2C4D63
422C63

Tetradic

645E2C
2C6342
2C3163
632C4D

Contrast Matrix WCAG 2.1 Contrast

645E2C
69917C
384D5A
BD5B3E
4D4253
—
1.9
Fail
1.3
Fail
1.5
Fail
1.4
Fail
1.9
Fail
—
2.5
Fail
1.3
Fail
2.7
Fail
1.3
Fail
2.5
Fail
—
2.0
Fail
1.1
Fail
1.5
Fail
1.3
Fail
2.0
Fail
—
2.1
Fail
1.4
Fail
2.7
Fail
1.1
Fail
2.1
Fail
—
White BG
6.6AA
3.5AA Large
8.8AAA
4.4AA Large
9.5AAA
Black BG
3.2AA Large
5.9AA
2.4Fail
4.7AA
2.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

616138
7A7B81
414157
939245
48484F

Deuteranopia

62623B
787582
403E56
98A047
494A4E

Tritanopia

644244
6B8586
395454
B84B4C
4C4C4B

Achromatopsia

5A5A5A
838383
484848
757575
474747

Shades & Tints Shades & Tints

#645E2C

Dark
Light

#69917C

Dark
Light

#384D5A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #645e2c;
  --color-2: #69917c;
  --color-3: #384d5a;
  --color-4: #bd5b3e;
  --color-5: #4d4253;
}

SCSS

$color-1: #645e2c;
$color-2: #69917c;
$color-3: #384d5a;
$color-4: #bd5b3e;
$color-5: #4d4253;

TAILWIND

colors: {
  'brand-1': '#645e2c',
  'brand-2': '#69917c',
  'brand-3': '#384d5a',
  'brand-4': '#bd5b3e',
  'brand-5': '#4d4253',
}

RGB Array

[100, 94, 44], [105, 145, 124], [56, 77, 90], [189, 91, 62], [77, 66, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #645E2C, #69917C, #384D5A, #BD5B3E, #4D4253 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. 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: #645e2c; --color-2: #69917c; --color-3: #384d5a; --color-4: #bd5b3e; --color-5: #4d4253. 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. 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 finance, legal, luxury 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