← Back to Editor

#FCDC72 · #FDCA1D · #BEB63A · #7D9C56 · #7D7047

earth

A 5-color earth 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

#FCDC72

Goose Yellow · Khaki · Sunflower

HEX
#FCDC72
RGB
rgb(252, 220, 114)
HSL
hsl(46, 96%, 72%)
HSB
hsb(46, 55%, 99%)
CMYK
cmyk(0%, 13%, 55%, 1%)
Oklch
oklch(90.0% 0.130 92.8)

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

#FDCA1D

Ginger · Gold · Sunflower

HEX
#FDCA1D
RGB
rgb(253, 202, 29)
HSL
hsl(46, 98%, 55%)
HSB
hsb(46, 89%, 99%)
CMYK
cmyk(0%, 20%, 89%, 1%)
Oklch
oklch(86.0% 0.171 89.6)

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

#BEB63A

Autumn Sage · GoldenRod · Honey Gold

HEX
#BEB63A
RGB
rgb(190, 182, 58)
HSL
hsl(56, 53%, 49%)
HSB
hsb(56, 69%, 75%)
CMYK
cmyk(0%, 4%, 69%, 25%)
Oklch
oklch(76.1% 0.141 105.6)

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

#7D9C56

Grass Green · Gray · Olive Green

HEX
#7D9C56
RGB
rgb(125, 156, 86)
HSL
hsl(87, 29%, 47%)
HSB
hsb(87, 45%, 61%)
CMYK
cmyk(20%, 0%, 45%, 39%)
Oklch
oklch(65.2% 0.103 128.5)

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

#7D7047

Ochre · DimGray · Honey Gold

HEX
#7D7047
RGB
rgb(125, 112, 71)
HSL
hsl(46, 28%, 38%)
HSB
hsb(46, 43%, 49%)
CMYK
cmyk(0%, 10%, 43%, 51%)
Oklch
oklch(54.7% 0.060 92.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCDC72
7393FC

Analogous

FC9873
FCDC72
D8FC73

Triadic

FCDC72
73FCDC
DC73FC

Split-Comp.

FCDC72
73D8FC
9873FC

Tetradic

FCDC72
73FC98
7393FC
FC73D8

Contrast Matrix WCAG 2.1 Contrast

FCDC72
FDCA1D
BEB63A
7D9C56
7D7047
—
1.1
Fail
1.6
Fail
2.3
Fail
3.6
AA Large
1.1
Fail
—
1.4
Fail
2.0
Fail
3.2
AA Large
1.6
Fail
1.4
Fail
—
1.5
Fail
2.3
Fail
2.3
Fail
2.0
Fail
1.5
Fail
—
1.6
Fail
3.6
AA Large
3.2
AA Large
2.3
Fail
1.6
Fail
—
White BG
1.3Fail
1.5Fail
2.1Fail
3.1AA Large
4.9AA
Black BG
15.6AAA
13.6AAA
9.9AAA
6.8AA
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

EEEE8C
E7E647
BBBA58
8A8B67
777751

Deuteranopia

F0F292
EAEE51
BBBC5F
89866B
787953

Tritanopia

FAA0A4
FA686F
BE7075
7F7477
7C595A

Achromatopsia

D9D9D9
C6C6C6
AAAAAA
8B8B8B
6F6F6F

Shades & Tints Shades & Tints

#FCDC72

Dark
Light

#FDCA1D

Dark
Light

#BEB63A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcdc72;
  --color-2: #fdca1d;
  --color-3: #beb63a;
  --color-4: #7d9c56;
  --color-5: #7d7047;
}

SCSS

$color-1: #fcdc72;
$color-2: #fdca1d;
$color-3: #beb63a;
$color-4: #7d9c56;
$color-5: #7d7047;

TAILWIND

colors: {
  'brand-1': '#fcdc72',
  'brand-2': '#fdca1d',
  'brand-3': '#beb63a',
  'brand-4': '#7d9c56',
  'brand-5': '#7d7047',
}

RGB Array

[252, 220, 114], [253, 202, 29], [190, 182, 58], [125, 156, 86], [125, 112, 71]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #FCDC72, #FDCA1D, #BEB63A, #7D9C56, #7D7047 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: #fcdc72; --color-2: #fdca1d; --color-3: #beb63a; --color-4: #7d9c56; --color-5: #7d7047. 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 earth-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