← Back to Editor

#FFFBDE · #B5F66F · #C4C358 · #FC724C · #85716D

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 AppData Visualization

Color Details Color Details

#FFFBDE

Fresh Green · LightYellow · Lemon Cream

HEX
#FFFBDE
RGB
rgb(255, 251, 222)
HSL
hsl(53, 100%, 94%)
HSB
hsb(53, 13%, 100%)
CMYK
cmyk(0%, 2%, 13%, 0%)
Oklch
oklch(98.4% 0.038 100.6)

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

#B5F66F

Willow Green · LightGreen · Apple Green

HEX
#B5F66F
RGB
rgb(181, 246, 111)
HSL
hsl(89, 88%, 70%)
HSB
hsb(89, 55%, 96%)
CMYK
cmyk(26%, 0%, 55%, 4%)
Oklch
oklch(90.2% 0.179 130.7)

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

#C4C358

Autumn Sage · BurlyWood · Sunflower

HEX
#C4C358
RGB
rgb(196, 195, 88)
HSL
hsl(59, 48%, 56%)
HSB
hsb(59, 55%, 77%)
CMYK
cmyk(0%, 1%, 55%, 23%)
Oklch
oklch(79.7% 0.130 108.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#FC724C

Peach Pink · Coral · Coral Red

HEX
#FC724C
RGB
rgb(252, 114, 76)
HSL
hsl(13, 97%, 64%)
HSB
hsb(13, 70%, 99%)
CMYK
cmyk(0%, 55%, 70%, 1%)
Oklch
oklch(71.2% 0.177 36.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#85716D

Crimson · Gray · Passion Red

HEX
#85716D
RGB
rgb(133, 113, 109)
HSL
hsl(10, 10%, 47%)
HSB
hsb(10, 18%, 52%)
CMYK
cmyk(0%, 15%, 18%, 48%)
Oklch
oklch(56.6% 0.026 31.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFBDE
E0E4FF

Analogous

FFECE0
FFFBDE
F3FFE0

Triadic

FFFBDE
E0FFFB
FBE0FF

Split-Comp.

FFFBDE
E0F3FF
ECE0FF

Tetradic

FFFBDE
E0FFEC
E0E4FF
FFE0F3

Contrast Matrix WCAG 2.1 Contrast

FFFBDE
B5F66F
C4C358
FC724C
85716D
—
1.2
Fail
1.8
Fail
2.6
Fail
4.4
AA Large
1.2
Fail
—
1.5
Fail
2.1
Fail
3.6
AA Large
1.8
Fail
1.5
Fail
—
1.5
Fail
2.5
Fail
2.6
Fail
2.1
Fail
1.5
Fail
—
1.7
Fail
4.4
AA Large
3.6
AA Large
2.5
Fail
1.7
Fail
—
White BG
1.0Fail
1.3Fail
1.9Fail
2.7Fail
4.6AA
Black BG
20.1AAA
16.4AAA
11.3AAA
7.7AAA
4.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FDFDE5
D1D290
C4C472
C0BF55
7C7C6E

Deuteranopia

FEFEE7
CDC998
C4C478
C8D357
7E7F6E

Tritanopia

FFEBEC
B8A9AF
C4868B
F55C5E
846F6F

Achromatopsia

F9F9F9
D3D3D3
B7B7B7
979797
777777

Shades & Tints Shades & Tints

#FFFBDE

Dark
Light

#B5F66F

Dark
Light

#C4C358

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffbde;
  --color-2: #b5f66f;
  --color-3: #c4c358;
  --color-4: #fc724c;
  --color-5: #85716d;
}

SCSS

$color-1: #fffbde;
$color-2: #b5f66f;
$color-3: #c4c358;
$color-4: #fc724c;
$color-5: #85716d;

TAILWIND

colors: {
  'brand-1': '#fffbde',
  'brand-2': '#b5f66f',
  'brand-3': '#c4c358',
  'brand-4': '#fc724c',
  'brand-5': '#85716d',
}

RGB Array

[255, 251, 222], [181, 246, 111], [196, 195, 88], [252, 114, 76], [133, 113, 109]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFFBDE, #B5F66F, #C4C358, #FC724C, #85716D is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #fffbde; --color-2: #b5f66f; --color-3: #c4c358; --color-4: #fc724c; --color-5: #85716d. 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 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