← Back to Editor

#FFECD1 · #B8D9B4 · #B1B898 · #96726B · #736462

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

#FFECD1

Goose Yellow · Bisque · Peach Orange

HEX
#FFECD1
RGB
rgb(255, 236, 209)
HSL
hsl(35, 100%, 91%)
HSB
hsb(35, 18%, 100%)
CMYK
cmyk(0%, 7%, 18%, 0%)
Oklch
oklch(95.1% 0.041 76.8)

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

#B8D9B4

Celadon · Silver · Apple Green

HEX
#B8D9B4
RGB
rgb(184, 217, 180)
HSL
hsl(114, 33%, 78%)
HSB
hsb(114, 17%, 85%)
CMYK
cmyk(15%, 0%, 17%, 15%)
Oklch
oklch(85.1% 0.061 142.1)

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

#B1B898

Willow Green · DarkGray · Apple Green

HEX
#B1B898
RGB
rgb(177, 184, 152)
HSL
hsl(73, 18%, 66%)
HSB
hsb(73, 17%, 72%)
CMYK
cmyk(4%, 0%, 17%, 28%)
Oklch
oklch(76.8% 0.045 117.5)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#96726B

Crimson · Gray · Passion Red

HEX
#96726B
RGB
rgb(150, 114, 107)
HSL
hsl(10, 17%, 50%)
HSB
hsb(10, 29%, 59%)
CMYK
cmyk(0%, 24%, 29%, 41%)
Oklch
oklch(58.6% 0.047 31.1)

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

#736462

Crimson · DimGray · Warm Gray

HEX
#736462
RGB
rgb(115, 100, 98)
HSL
hsl(7, 8%, 42%)
HSB
hsb(7, 15%, 45%)
CMYK
cmyk(0%, 13%, 15%, 55%)
Oklch
oklch(51.7% 0.020 26.8)

Traditional「Crimson」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFECD1
D1E4FF

Analogous

FFD5D1
FFECD1
FBFFD1

Triadic

FFECD1
D1FFEC
ECD1FF

Split-Comp.

FFECD1
D1FBFF
D5D1FF

Tetradic

FFECD1
D1FFD5
D1E4FF
FFD1FB

Contrast Matrix WCAG 2.1 Contrast

FFECD1
B8D9B4
B1B898
96726B
736462
—
1.3
Fail
1.8
Fail
3.7
AA Large
4.9
AA
1.3
Fail
—
1.3
Fail
2.8
Fail
3.7
AA Large
1.8
Fail
1.3
Fail
—
2.1
Fail
2.7
Fail
3.7
AA Large
2.8
Fail
2.1
Fail
—
1.3
Fail
4.9
AA
3.7
AA Large
2.7
Fail
1.3
Fail
—
White BG
1.2Fail
1.5Fail
2.1Fail
4.3AA Large
5.6AA
Black BG
18.2AAA
13.6AAA
10.2AAA
4.9AA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F7F7D8
C6C7BD
B4B4A0
86866D
6D6C62

Deuteranopia

F8F9D9
C4C2BF
B4B3A2
898B6D
6D6F63

Tritanopia

FEDDDE
BAC4C6
B1A6A7
946E6E
726363

Achromatopsia

EFEFEF
CBCBCB
B2B2B2
7C7C7C
686868

Shades & Tints Shades & Tints

#FFECD1

Dark
Light

#B8D9B4

Dark
Light

#B1B898

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffecd1;
  --color-2: #b8d9b4;
  --color-3: #b1b898;
  --color-4: #96726b;
  --color-5: #736462;
}

SCSS

$color-1: #ffecd1;
$color-2: #b8d9b4;
$color-3: #b1b898;
$color-4: #96726b;
$color-5: #736462;

TAILWIND

colors: {
  'brand-1': '#ffecd1',
  'brand-2': '#b8d9b4',
  'brand-3': '#b1b898',
  'brand-4': '#96726b',
  'brand-5': '#736462',
}

RGB Array

[255, 236, 209], [184, 217, 180], [177, 184, 152], [150, 114, 107], [115, 100, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFECD1, #B8D9B4, #B1B898, #96726B, #736462 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: #ffecd1; --color-2: #b8d9b4; --color-3: #b1b898; --color-4: #96726b; --color-5: #736462. 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