← Back to Editor

#5C7A7A · #909984 · #CEBA97 · #F6DDB4 · #EEB389

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#5C7A7A

Slate Blue · DimGray · Mint Ice

HEX
#5C7A7A
RGB
rgb(92, 122, 122)
HSL
hsl(180, 14%, 42%)
HSB
hsb(180, 25%, 48%)
CMYK
cmyk(25%, 0%, 0%, 52%)
Oklch
oklch(55.6% 0.034 196.2)

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

#909984

Grass Green · Gray · Silver Sand

HEX
#909984
RGB
rgb(144, 153, 132)
HSL
hsl(86, 9%, 56%)
HSB
hsb(86, 14%, 60%)
CMYK
cmyk(6%, 0%, 14%, 40%)
Oklch
oklch(67.0% 0.032 126.2)

Traditional「Grass Green」· Paint「Silver Sand」· Creative Urban Concrete

#CEBA97

Ginger · Tan · Warm Sun

HEX
#CEBA97
RGB
rgb(206, 186, 151)
HSL
hsl(38, 36%, 70%)
HSB
hsb(38, 27%, 81%)
CMYK
cmyk(0%, 10%, 27%, 19%)
Oklch
oklch(79.7% 0.052 81.6)

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

#F6DDB4

Goose Yellow · Wheat · Peach Orange

HEX
#F6DDB4
RGB
rgb(246, 221, 180)
HSL
hsl(37, 79%, 84%)
HSB
hsb(37, 27%, 96%)
CMYK
cmyk(0%, 10%, 27%, 4%)
Oklch
oklch(90.8% 0.060 80.0)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#EEB389

Apricot · BurlyWood · Warm Sun

HEX
#EEB389
RGB
rgb(238, 179, 137)
HSL
hsl(25, 75%, 74%)
HSB
hsb(25, 42%, 93%)
CMYK
cmyk(0%, 25%, 42%, 7%)
Oklch
oklch(81.1% 0.089 56.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C7A7A
7A5C5C

Analogous

5C7A6B
5C7A7A
5C6B7A

Triadic

5C7A7A
7A5C7A
7A7A5C

Split-Comp.

5C7A7A
7A5C6B
7A6B5C

Tetradic

5C7A7A
6B5C7A
7A5C5C
6B7A5C

Contrast Matrix WCAG 2.1 Contrast

5C7A7A
909984
CEBA97
F6DDB4
EEB389
—
1.6
Fail
2.5
Fail
3.5
AA Large
2.5
Fail
1.6
Fail
—
1.6
Fail
2.3
Fail
1.6
Fail
2.5
Fail
1.6
Fail
—
1.4
Fail
1.0
Fail
3.5
AA Large
2.3
Fail
1.4
Fail
—
1.4
Fail
2.5
Fail
1.6
Fail
1.0
Fail
1.4
Fail
—
White BG
4.6AA
3.0Fail
1.9Fail
1.3Fail
1.8Fail
Black BG
4.5AA
7.1AAA
11.1AAA
15.9AAA
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

69697A
949489
C5C59F
EBEBBE
D4D493

Deuteranopia

67657A
93938A
C7C8A2
EDEFC0
D8DC96

Tritanopia

5D7A7A
908D8E
CDA6A8
F5C6C7
EB9B9D

Achromatopsia

717171
949494
BCBCBC
E0E0E0
C0C0C0

Shades & Tints Shades & Tints

#5C7A7A

Dark
Light

#909984

Dark
Light

#CEBA97

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c7a7a;
  --color-2: #909984;
  --color-3: #ceba97;
  --color-4: #f6ddb4;
  --color-5: #eeb389;
}

SCSS

$color-1: #5c7a7a;
$color-2: #909984;
$color-3: #ceba97;
$color-4: #f6ddb4;
$color-5: #eeb389;

TAILWIND

colors: {
  'brand-1': '#5c7a7a',
  'brand-2': '#909984',
  'brand-3': '#ceba97',
  'brand-4': '#f6ddb4',
  'brand-5': '#eeb389',
}

RGB Array

[92, 122, 122], [144, 153, 132], [206, 186, 151], [246, 221, 180], [238, 179, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5C7A7A, #909984, #CEBA97, #F6DDB4, #EEB389 is ideal for: health products, baby brands, fresh-style blogs, 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: #5c7a7a; --color-2: #909984; --color-3: #ceba97; --color-4: #f6ddb4; --color-5: #eeb389. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 general-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