← Back to Editor

#98B986 · #CCD9B9 · #EBDCB5 · #FFB46C · #FFAC00

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#98B986

Celadon · DarkSeaGreen · Apple Green

HEX
#98B986
RGB
rgb(152, 185, 134)
HSL
hsl(99, 27%, 63%)
HSB
hsb(99, 28%, 73%)
CMYK
cmyk(18%, 0%, 28%, 27%)
Oklch
oklch(74.8% 0.080 134.8)

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

#CCD9B9

Willow Green · LightGray · Apple Green

HEX
#CCD9B9
RGB
rgb(204, 217, 185)
HSL
hsl(84, 30%, 79%)
HSB
hsb(84, 15%, 85%)
CMYK
cmyk(6%, 0%, 15%, 15%)
Oklch
oklch(86.7% 0.045 125.4)

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

#EBDCB5

Goose Yellow · Wheat · Lemon Cream

HEX
#EBDCB5
RGB
rgb(235, 220, 181)
HSL
hsl(43, 57%, 82%)
HSB
hsb(43, 23%, 92%)
CMYK
cmyk(0%, 6%, 23%, 8%)
Oklch
oklch(89.7% 0.054 89.5)

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

#FFB46C

Apricot · SandyBrown · Warm Sun

HEX
#FFB46C
RGB
rgb(255, 180, 108)
HSL
hsl(29, 100%, 71%)
HSB
hsb(29, 58%, 100%)
CMYK
cmyk(0%, 29%, 58%, 0%)
Oklch
oklch(82.7% 0.125 63.5)

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

#FFAC00

Ochre · Orange · Honey Gold

HEX
#FFAC00
RGB
rgb(255, 172, 0)
HSL
hsl(40, 100%, 50%)
HSB
hsb(40, 100%, 100%)
CMYK
cmyk(0%, 33%, 100%, 0%)
Oklch
oklch(80.5% 0.170 74.3)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

98B986
A887BA

Analogous

B2BA87
98B986
87BA8F

Triadic

98B986
8799BA
BA8799

Split-Comp.

98B986
8F87BA
BA87B2

Tetradic

98B986
87B2BA
A887BA
BA8F87

Contrast Matrix WCAG 2.1 Contrast

98B986
CCD9B9
EBDCB5
FFB46C
FFAC00
—
1.5
Fail
1.6
Fail
1.2
Fail
1.2
Fail
1.5
Fail
—
1.1
Fail
1.2
Fail
1.3
Fail
1.6
Fail
1.1
Fail
—
1.3
Fail
1.4
Fail
1.2
Fail
1.2
Fail
1.3
Fail
—
1.1
Fail
1.2
Fail
1.3
Fail
1.4
Fail
1.1
Fail
—
White BG
2.2Fail
1.5Fail
1.4Fail
1.8Fail
1.9Fail
Black BG
9.6AAA
14.2AAA
15.4AAA
12.0AAA
11.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A792
D2D2C1
E5E4BE
DFDE7D
DBDA2A

Deuteranopia

A4A295
D1D0C3
E5E7C1
E3E982
E0E634

Tritanopia

9A9C9E
CDC7C8
EAC6C8
FB8B8E
FB4A52

Achromatopsia

A9A9A9
D1D1D1
DCDCDC
C2C2C2
B1B1B1

Shades & Tints Shades & Tints

#98B986

Dark
Light

#CCD9B9

Dark
Light

#EBDCB5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #98b986;
  --color-2: #ccd9b9;
  --color-3: #ebdcb5;
  --color-4: #ffb46c;
  --color-5: #ffac00;
}

SCSS

$color-1: #98b986;
$color-2: #ccd9b9;
$color-3: #ebdcb5;
$color-4: #ffb46c;
$color-5: #ffac00;

TAILWIND

colors: {
  'brand-1': '#98b986',
  'brand-2': '#ccd9b9',
  'brand-3': '#ebdcb5',
  'brand-4': '#ffb46c',
  'brand-5': '#ffac00',
}

RGB Array

[152, 185, 134], [204, 217, 185], [235, 220, 181], [255, 180, 108], [255, 172, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #98B986, #CCD9B9, #EBDCB5, #FFB46C, #FFAC00 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #98b986; --color-2: #ccd9b9; --color-3: #ebdcb5; --color-4: #ffb46c; --color-5: #ffac00. 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. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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