← Back to Editor

#639A7C · #607555 · #644B3E · #682B38 · #3F1A22

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#639A7C

Celadon · SlateGray · Olive Green

HEX
#639A7C
RGB
rgb(99, 154, 124)
HSL
hsl(147, 22%, 50%)
HSB
hsb(147, 36%, 60%)
CMYK
cmyk(36%, 0%, 19%, 40%)
Oklch
oklch(63.9% 0.074 159.5)

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

#607555

Celadon · DimGray · Forest Green

HEX
#607555
RGB
rgb(96, 117, 85)
HSL
hsl(99, 16%, 40%)
HSB
hsb(99, 27%, 46%)
CMYK
cmyk(18%, 0%, 27%, 54%)
Oklch
oklch(53.6% 0.054 135.0)

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

#644B3E

Tangerine · DarkOliveGreen · Amber Brown

HEX
#644B3E
RGB
rgb(100, 75, 62)
HSL
hsl(21, 23%, 32%)
HSB
hsb(21, 38%, 39%)
CMYK
cmyk(0%, 25%, 38%, 61%)
Oklch
oklch(43.6% 0.040 48.7)

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

#682B38

Crimson · Brown · Wine Red

HEX
#682B38
RGB
rgb(104, 43, 56)
HSL
hsl(347, 41%, 29%)
HSB
hsb(347, 59%, 41%)
CMYK
cmyk(0%, 59%, 46%, 59%)
Oklch
oklch(37.9% 0.088 9.0)

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

#3F1A22

Crimson · DarkSlateGray · Deep Berry

HEX
#3F1A22
RGB
rgb(63, 26, 34)
HSL
hsl(347, 42%, 17%)
HSB
hsb(347, 59%, 25%)
CMYK
cmyk(0%, 59%, 46%, 75%)
Oklch
oklch(27.5% 0.058 8.1)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

639A7C
9C6382

Analogous

669C63
639A7C
639C99

Triadic

639A7C
7D639C
9C7D63

Split-Comp.

639A7C
99639C
9C6366

Tetradic

639A7C
63669C
9C6382
9C9963

Contrast Matrix WCAG 2.1 Contrast

639A7C
607555
644B3E
682B38
3F1A22
—
1.5
Fail
2.5
Fail
3.2
AA Large
4.7
AA
1.5
Fail
—
1.6
Fail
2.1
Fail
3.0
AA Large
2.5
Fail
1.6
Fail
—
1.3
Fail
1.9
Fail
3.2
AA Large
2.1
Fail
1.3
Fail
—
1.4
Fail
4.7
AA
3.0
AA Large
1.9
Fail
1.4
Fail
—
White BG
3.3AA Large
5.0AA
8.0AAA
10.5AAA
15.2AAA
Black BG
6.4AA
4.2AA Large
2.6Fail
2.0Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7B7B83
69695D
595941
4E4D35
2F2F20

Deuteranopia

787485
68665F
5B5D42
515634
313420

Tritanopia

66898A
616364
634444
653232
3D1F1E

Achromatopsia

868686
6B6B6B
515151
3F3F3F
262626

Shades & Tints Shades & Tints

#639A7C

Dark
Light

#607555

Dark
Light

#644B3E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #639a7c;
  --color-2: #607555;
  --color-3: #644b3e;
  --color-4: #682b38;
  --color-5: #3f1a22;
}

SCSS

$color-1: #639a7c;
$color-2: #607555;
$color-3: #644b3e;
$color-4: #682b38;
$color-5: #3f1a22;

TAILWIND

colors: {
  'brand-1': '#639a7c',
  'brand-2': '#607555',
  'brand-3': '#644b3e',
  'brand-4': '#682b38',
  'brand-5': '#3f1a22',
}

RGB Array

[99, 154, 124], [96, 117, 85], [100, 75, 62], [104, 43, 56], [63, 26, 34]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #639A7C, #607555, #644B3E, #682B38, #3F1A22 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: #639a7c; --color-2: #607555; --color-3: #644b3e; --color-4: #682b38; --color-5: #3f1a22. 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 general-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