← Back to Editor

#665E55 · #A4CEB9 · #D9EEDA · #FDFCE5 · #F2E9C6

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#665E55

Ochre · DimGray · Charcoal

HEX
#665E55
RGB
rgb(102, 94, 85)
HSL
hsl(32, 9%, 37%)
HSB
hsb(32, 17%, 40%)
CMYK
cmyk(0%, 8%, 17%, 60%)
Oklch
oklch(48.7% 0.017 70.7)

Traditional「Ochre」· Paint「Charcoal」· Creative Midnight Shadow

#A4CEB9

Jade · Silver · Apple Green

HEX
#A4CEB9
RGB
rgb(164, 206, 185)
HSL
hsl(150, 30%, 73%)
HSB
hsb(150, 20%, 81%)
CMYK
cmyk(20%, 0%, 10%, 19%)
Oklch
oklch(81.5% 0.053 163.3)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#D9EEDA

Celadon · LightGray · Mint Green

HEX
#D9EEDA
RGB
rgb(217, 238, 218)
HSL
hsl(123, 38%, 89%)
HSB
hsb(123, 9%, 93%)
CMYK
cmyk(9%, 0%, 8%, 7%)
Oklch
oklch(92.8% 0.035 146.6)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#FDFCE5

Fresh Green · LightYellow · Lemon Cream

HEX
#FDFCE5
RGB
rgb(253, 252, 229)
HSL
hsl(58, 86%, 95%)
HSB
hsb(58, 9%, 99%)
CMYK
cmyk(0%, 0%, 9%, 1%)
Oklch
oklch(98.6% 0.030 104.9)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#F2E9C6

Goose Yellow · Bisque · Lemon Cream

HEX
#F2E9C6
RGB
rgb(242, 233, 198)
HSL
hsl(48, 63%, 86%)
HSB
hsb(48, 18%, 95%)
CMYK
cmyk(0%, 4%, 18%, 5%)
Oklch
oklch(93.2% 0.047 95.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

665E55
565E67

Analogous

675656
665E55
666756

Triadic

665E55
56675F
5F5667

Split-Comp.

665E55
566667
565667

Tetradic

665E55
566756
565E67
675666

Contrast Matrix WCAG 2.1 Contrast

665E55
A4CEB9
D9EEDA
FDFCE5
F2E9C6
—
3.7
AA Large
5.2
AA
6.1
AA
5.2
AA
3.7
AA Large
—
1.4
Fail
1.7
Fail
1.4
Fail
5.2
AA
1.4
Fail
—
1.2
Fail
1.0
Fail
6.1
AA
1.7
Fail
1.2
Fail
—
1.2
Fail
5.2
AA
1.4
Fail
1.0
Fail
1.2
Fail
—
White BG
6.4AA
1.7Fail
1.2Fail
1.0Fail
1.2Fail
Black BG
3.3AA Large
12.1AAA
17.2AAA
20.2AAA
17.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

636257
B6B7BE
E2E2DF
FDFDEB
EEEECE

Deuteranopia

636458
B4B1BF
E1DFE0
FDFDEC
EFEFD1

Tritanopia

665959
A6C2C3
DAE3E4
FDEFF0
F2D5D7

Achromatopsia

5F5F5F
BFBFBF
E5E5E5
FAFAFA
E8E8E8

Shades & Tints Shades & Tints

#665E55

Dark
Light

#A4CEB9

Dark
Light

#D9EEDA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #665e55;
  --color-2: #a4ceb9;
  --color-3: #d9eeda;
  --color-4: #fdfce5;
  --color-5: #f2e9c6;
}

SCSS

$color-1: #665e55;
$color-2: #a4ceb9;
$color-3: #d9eeda;
$color-4: #fdfce5;
$color-5: #f2e9c6;

TAILWIND

colors: {
  'brand-1': '#665e55',
  'brand-2': '#a4ceb9',
  'brand-3': '#d9eeda',
  'brand-4': '#fdfce5',
  'brand-5': '#f2e9c6',
}

RGB Array

[102, 94, 85], [164, 206, 185], [217, 238, 218], [253, 252, 229], [242, 233, 198]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #665E55, #A4CEB9, #D9EEDA, #FDFCE5, #F2E9C6 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: #665e55; --color-2: #a4ceb9; --color-3: #d9eeda; --color-4: #fdfce5; --color-5: #f2e9c6. 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