← Back to Editor

#537F7E · #D6AD8F · #CC8D7C · #744B5D · #4F4F69

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 Library

Color Details Color Details

#537F7E

Mineral Blue · SlateGray · Mint Ice

HEX
#537F7E
RGB
rgb(83, 127, 126)
HSL
hsl(179, 21%, 41%)
HSB
hsb(179, 35%, 50%)
CMYK
cmyk(35%, 0%, 1%, 50%)
Oklch
oklch(56.4% 0.048 194.1)

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

#D6AD8F

Apricot · Tan · Warm Sun

HEX
#D6AD8F
RGB
rgb(214, 173, 143)
HSL
hsl(25, 46%, 70%)
HSB
hsb(25, 33%, 84%)
CMYK
cmyk(0%, 19%, 33%, 16%)
Oklch
oklch(77.7% 0.063 57.8)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#CC8D7C

Peach Pink · DarkSalmon · Coral Red

HEX
#CC8D7C
RGB
rgb(204, 141, 124)
HSL
hsl(13, 44%, 64%)
HSB
hsb(13, 39%, 80%)
CMYK
cmyk(0%, 31%, 39%, 20%)
Oklch
oklch(70.2% 0.081 35.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#744B5D

Dark Violet · DimGray · Camellia

HEX
#744B5D
RGB
rgb(116, 75, 93)
HSL
hsl(334, 21%, 37%)
HSB
hsb(334, 35%, 45%)
CMYK
cmyk(0%, 35%, 20%, 55%)
Oklch
oklch(46.5% 0.061 351.8)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#4F4F69

Deep Indigo · DimGray · Prussian Blue

HEX
#4F4F69
RGB
rgb(79, 79, 105)
HSL
hsl(240, 14%, 36%)
HSB
hsb(240, 25%, 41%)
CMYK
cmyk(25%, 25%, 0%, 59%)
Oklch
oklch(43.8% 0.043 284.5)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

537F7E
7F5353

Analogous

537F68
537F7E
53697F

Triadic

537F7E
7E537F
7F7E53

Split-Comp.

537F7E
7F5369
7F6853

Tetradic

537F7E
68537F
7F5353
697F53

Contrast Matrix WCAG 2.1 Contrast

537F7E
D6AD8F
CC8D7C
744B5D
4F4F69
—
2.2
Fail
1.6
Fail
1.6
Fail
1.8
Fail
2.2
Fail
—
1.3
Fail
3.5
AA Large
3.9
AA Large
1.6
Fail
1.3
Fail
—
2.6
Fail
2.9
Fail
1.6
Fail
3.5
AA Large
2.6
Fail
—
1.1
Fail
1.8
Fail
3.9
AA Large
2.9
Fail
1.1
Fail
—
White BG
4.5AA Large
2.1Fail
2.7Fail
7.2AAA
7.9AAA
Black BG
4.7AA
10.2AAA
7.7AAA
2.9Fail
2.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

66667E
C4C496
B1B080
626259
4F4F63

Deuteranopia

64607E
C7CA98
B4B981
656858
4F4F61

Tritanopia

557E7E
D49C9D
C98384
725554
4F5E5D

Achromatopsia

727272
B6B6B6
9E9E9E
595959
525252

Shades & Tints Shades & Tints

#537F7E

Dark
Light

#D6AD8F

Dark
Light

#CC8D7C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #537f7e;
  --color-2: #d6ad8f;
  --color-3: #cc8d7c;
  --color-4: #744b5d;
  --color-5: #4f4f69;
}

SCSS

$color-1: #537f7e;
$color-2: #d6ad8f;
$color-3: #cc8d7c;
$color-4: #744b5d;
$color-5: #4f4f69;

TAILWIND

colors: {
  'brand-1': '#537f7e',
  'brand-2': '#d6ad8f',
  'brand-3': '#cc8d7c',
  'brand-4': '#744b5d',
  'brand-5': '#4f4f69',
}

RGB Array

[83, 127, 126], [214, 173, 143], [204, 141, 124], [116, 75, 93], [79, 79, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #537F7E, #D6AD8F, #CC8D7C, #744B5D, #4F4F69 is ideal for: brand design, premium product pages, magazine layouts. 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: #537f7e; --color-2: #d6ad8f; --color-3: #cc8d7c; --color-4: #744b5d; --color-5: #4f4f69. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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. 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