← Back to Editor

#144C4F · #334C4F · #554C4F · #774C4F · #994C4F

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

#144C4F

Lake Blue · DarkSlateGray · Peacock Green

HEX
#144C4F
RGB
rgb(20, 76, 79)
HSL
hsl(183, 60%, 19%)
HSB
hsb(183, 75%, 31%)
CMYK
cmyk(75%, 4%, 0%, 69%)
Oklch
oklch(38.3% 0.056 200.3)

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

#334C4F

Slate Blue · DarkSlateGray · Peacock Green

HEX
#334C4F
RGB
rgb(51, 76, 79)
HSL
hsl(186, 22%, 25%)
HSB
hsb(186, 35%, 31%)
CMYK
cmyk(35%, 4%, 0%, 69%)
Oklch
oklch(39.7% 0.031 205.4)

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

#554C4F

Ink Gray · DarkSlateGray · Charcoal

HEX
#554C4F
RGB
rgb(85, 76, 79)
HSL
hsl(340, 6%, 32%)
HSB
hsb(340, 11%, 33%)
CMYK
cmyk(0%, 11%, 7%, 67%)
Oklch
oklch(42.6% 0.013 355.4)

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

#774C4F

Crimson · DimGray · Wine Red

HEX
#774C4F
RGB
rgb(119, 76, 79)
HSL
hsl(356, 22%, 38%)
HSB
hsb(356, 36%, 47%)
CMYK
cmyk(0%, 36%, 34%, 53%)
Oklch
oklch(46.6% 0.059 15.0)

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

#994C4F

Crimson · Sienna · Passion Red

HEX
#994C4F
RGB
rgb(153, 76, 79)
HSL
hsl(358, 34%, 45%)
HSB
hsb(358, 50%, 60%)
CMYK
cmyk(0%, 50%, 48%, 40%)
Oklch
oklch(51.3% 0.103 18.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

144C4F
4E1613

Analogous

134E33
144C4F
132E4E

Triadic

144C4F
4E134B
4B4E13

Split-Comp.

144C4F
4E132E
4E3313

Tetradic

144C4F
33134E
4E1613
2E4E13

Contrast Matrix WCAG 2.1 Contrast

144C4F
334C4F
554C4F
774C4F
994C4F
—
1.1
Fail
1.2
Fail
1.3
Fail
1.6
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.5
Fail
1.2
Fail
1.1
Fail
—
1.2
Fail
1.4
Fail
1.3
Fail
1.3
Fail
1.2
Fail
—
1.2
Fail
1.6
Fail
1.5
Fail
1.4
Fail
1.2
Fail
—
White BG
9.6AAA
9.2AAA
8.3AAA
7.2AAA
6.0AA
Black BG
2.2Fail
2.3Fail
2.5Fail
2.9Fail
3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2D4E
3E3E4E
51514E
64644E
78774E

Deuteranopia

29254E
3C3B4E
52524E
676A4E
7C824E

Tritanopia

174E4E
344E4E
554E4E
754E4E
954E4E

Achromatopsia

3C3C3C
454545
4F4F4F
595959
636363

Shades & Tints Shades & Tints

#144C4F

Dark
Light

#334C4F

Dark
Light

#554C4F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #144c4f;
  --color-2: #334c4f;
  --color-3: #554c4f;
  --color-4: #774c4f;
  --color-5: #994c4f;
}

SCSS

$color-1: #144c4f;
$color-2: #334c4f;
$color-3: #554c4f;
$color-4: #774c4f;
$color-5: #994c4f;

TAILWIND

colors: {
  'brand-1': '#144c4f',
  'brand-2': '#334c4f',
  'brand-3': '#554c4f',
  'brand-4': '#774c4f',
  'brand-5': '#994c4f',
}

RGB Array

[20, 76, 79], [51, 76, 79], [85, 76, 79], [119, 76, 79], [153, 76, 79]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #144C4F, #334C4F, #554C4F, #774C4F, #994C4F 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: #144c4f; --color-2: #334c4f; --color-3: #554c4f; --color-4: #774c4f; --color-5: #994c4f. 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