← Back to Editor

#FCC81A · #BDC23B · #7EBD5C · #3FB77C · #00B19D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#FCC81A

Ginger · Gold · Sunflower

HEX
#FCC81A
RGB
rgb(252, 200, 26)
HSL
hsl(46, 97%, 55%)
HSB
hsb(46, 90%, 99%)
CMYK
cmyk(0%, 21%, 90%, 1%)
Oklch
oklch(85.5% 0.171 89.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#BDC23B

Autumn Sage · GoldenRod · Honey Gold

HEX
#BDC23B
RGB
rgb(189, 194, 59)
HSL
hsl(62, 53%, 50%)
HSB
hsb(62, 70%, 76%)
CMYK
cmyk(3%, 0%, 70%, 24%)
Oklch
oklch(78.6% 0.153 111.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#7EBD5C

Celadon · DarkSeaGreen · Olive Green

HEX
#7EBD5C
RGB
rgb(126, 189, 92)
HSL
hsl(99, 42%, 55%)
HSB
hsb(99, 51%, 74%)
CMYK
cmyk(33%, 0%, 51%, 26%)
Oklch
oklch(73.4% 0.145 135.7)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#3FB77C

Mineral Blue · MediumSeaGreen · Olive Green

HEX
#3FB77C
RGB
rgb(63, 183, 124)
HSL
hsl(151, 49%, 48%)
HSB
hsb(151, 66%, 72%)
CMYK
cmyk(66%, 0%, 32%, 28%)
Oklch
oklch(69.8% 0.138 158.0)

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

#00B19D

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#00B19D
RGB
rgb(0, 177, 157)
HSL
hsl(173, 100%, 35%)
HSB
hsb(173, 100%, 69%)
CMYK
cmyk(100%, 0%, 11%, 31%)
Oklch
oklch(68.2% 0.123 181.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCC81A
1D51FC

Analogous

FC581D
FCC81A
C0FC1D

Triadic

FCC81A
1DFCC8
C81DFC

Split-Comp.

FCC81A
1DC0FC
581DFC

Tetradic

FCC81A
1DFC58
1D51FC
FC1DC0

Contrast Matrix WCAG 2.1 Contrast

FCC81A
BDC23B
7EBD5C
3FB77C
00B19D
—
1.2
Fail
1.4
Fail
1.6
Fail
1.7
Fail
1.2
Fail
—
1.2
Fail
1.3
Fail
1.4
Fail
1.4
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.6
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.7
Fail
1.4
Fail
1.2
Fail
1.1
Fail
—
White BG
1.6Fail
1.9Fail
2.3Fail
2.5Fail
2.7Fail
Black BG
13.4AAA
10.9AAA
9.3AAA
8.3AAA
7.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E544
BFBF5C
999A73
73748A
4D4EA2

Deuteranopia

E9EC4E
BFBE64
969179
6C638E
4235A3

Tritanopia

F9656D
BD757B
81868A
459698
09A6A7

Achromatopsia

C4C4C4
B1B1B1
9F9F9F
8C8C8C
7A7A7A

Shades & Tints Shades & Tints

#FCC81A

Dark
Light

#BDC23B

Dark
Light

#7EBD5C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcc81a;
  --color-2: #bdc23b;
  --color-3: #7ebd5c;
  --color-4: #3fb77c;
  --color-5: #00b19d;
}

SCSS

$color-1: #fcc81a;
$color-2: #bdc23b;
$color-3: #7ebd5c;
$color-4: #3fb77c;
$color-5: #00b19d;

TAILWIND

colors: {
  'brand-1': '#fcc81a',
  'brand-2': '#bdc23b',
  'brand-3': '#7ebd5c',
  'brand-4': '#3fb77c',
  'brand-5': '#00b19d',
}

RGB Array

[252, 200, 26], [189, 194, 59], [126, 189, 92], [63, 183, 124], [0, 177, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCC81A, #BDC23B, #7EBD5C, #3FB77C, #00B19D is ideal for: social media posters, mobile apps, e-commerce promos. 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: #fcc81a; --color-2: #bdc23b; --color-3: #7ebd5c; --color-4: #3fb77c; --color-5: #00b19d. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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