← Back to Editor

#FFFCCE · #CCD7AC · #ADC5A1 · #81AC99 · #64958F

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

#FFFCCE

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFCCE
RGB
rgb(255, 252, 206)
HSL
hsl(56, 100%, 90%)
HSB
hsb(56, 19%, 100%)
CMYK
cmyk(0%, 1%, 19%, 0%)
Oklch
oklch(98.2% 0.059 104.3)

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

#CCD7AC

Willow Green · Silver · Apple Green

HEX
#CCD7AC
RGB
rgb(204, 215, 172)
HSL
hsl(75, 35%, 76%)
HSB
hsb(75, 20%, 84%)
CMYK
cmyk(5%, 0%, 20%, 16%)
Oklch
oklch(86.0% 0.059 119.3)

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

#ADC5A1

Celadon · DarkGray · Apple Green

HEX
#ADC5A1
RGB
rgb(173, 197, 161)
HSL
hsl(100, 24%, 70%)
HSB
hsb(100, 18%, 77%)
CMYK
cmyk(12%, 0%, 18%, 23%)
Oklch
oklch(79.6% 0.056 135.2)

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

#81AC99

Mineral Blue · DarkSeaGreen · Olive Green

HEX
#81AC99
RGB
rgb(129, 172, 153)
HSL
hsl(153, 21%, 59%)
HSB
hsb(153, 25%, 67%)
CMYK
cmyk(25%, 0%, 11%, 33%)
Oklch
oklch(70.8% 0.054 165.9)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#64958F

Mineral Blue · CadetBlue · Mint Ice

HEX
#64958F
RGB
rgb(100, 149, 143)
HSL
hsl(173, 20%, 49%)
HSB
hsb(173, 33%, 58%)
CMYK
cmyk(33%, 0%, 4%, 42%)
Oklch
oklch(63.3% 0.054 186.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFCCE
CCCFFF

Analogous

FFE2CC
FFFCCE
E9FFCC

Triadic

FFFCCE
CCFFFC
FCCCFF

Split-Comp.

FFFCCE
CCE9FF
E2CCFF

Tetradic

FFFCCE
CCFFE2
CCCFFF
FFCCE9

Contrast Matrix WCAG 2.1 Contrast

FFFCCE
CCD7AC
ADC5A1
81AC99
64958F
—
1.4
Fail
1.8
Fail
2.4
Fail
3.2
AA Large
1.4
Fail
—
1.2
Fail
1.7
Fail
2.2
Fail
1.8
Fail
1.2
Fail
—
1.4
Fail
1.8
Fail
2.4
Fail
1.7
Fail
1.4
Fail
—
1.3
Fail
3.2
AA Large
2.2
Fail
1.8
Fail
1.3
Fail
—
White BG
1.0Fail
1.5Fail
1.9Fail
2.5Fail
3.4AA Large
Black BG
20.1AAA
13.9AAA
11.3AAA
8.3AAA
6.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FEFED9
D1D1B6
B7B8AA
94949E
797A90

Deuteranopia

FEFEDC
D0CFB9
B6B4AC
918E9F
767391

Tritanopia

FFE2E4
CDBFC0
AEB1B2
83A1A2
669292

Achromatopsia

F8F8F8
CFCFCF
BABABA
9D9D9D
868686

Shades & Tints Shades & Tints

#FFFCCE

Dark
Light

#CCD7AC

Dark
Light

#ADC5A1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffcce;
  --color-2: #ccd7ac;
  --color-3: #adc5a1;
  --color-4: #81ac99;
  --color-5: #64958f;
}

SCSS

$color-1: #fffcce;
$color-2: #ccd7ac;
$color-3: #adc5a1;
$color-4: #81ac99;
$color-5: #64958f;

TAILWIND

colors: {
  'brand-1': '#fffcce',
  'brand-2': '#ccd7ac',
  'brand-3': '#adc5a1',
  'brand-4': '#81ac99',
  'brand-5': '#64958f',
}

RGB Array

[255, 252, 206], [204, 215, 172], [173, 197, 161], [129, 172, 153], [100, 149, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFCCE, #CCD7AC, #ADC5A1, #81AC99, #64958F 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: #fffcce; --color-2: #ccd7ac; --color-3: #adc5a1; --color-4: #81ac99; --color-5: #64958f. 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