Pikka Logo Pikka
Chrome App
Radiant Golden Ochre Citrus Yellow Category: Yellow

Marigold (#EAA221) — Color Codes, Meaning & UI Palettes

Marigold (#EAA221) is a radiant, golden-amber orange-yellow inspired by the vibrant blossoms of Tagetes. Celebrated across global festivals, it represents optimism, warm celebration, prosperity, and sunny joy.

Quick Answer (Marigold Color Code): The exact HEX code for Marigold is #EAA221. In RGB, it is rgb(234, 162, 33). In HSL, it is hsl(39deg, 83%, 52%), and its print CMYK formulation is cmyk(0%, 31%, 86%, 8%). It has a relative luminance of 0.434 and pairs best in UI design with Deep Indigo Navy (#1E1B4B) and Pure White (#FFFFFF).
Click to Copy HEX
Marigold
#EAA221
HEX
#EAA221
RGB
rgb(234, 162, 33)
HSL
hsl(39deg, 83%, 52%)
CMYK (Print)
cmyk(0%, 31%, 86%, 8%)
Apple Display P3
color(display-p3 0.918 0.635 0.129)

WCAG 2.1 Accessibility & Contrast Rating

White Text (#FFFFFF) 2.17:1 (Fail)
Black Text (#000000) 9.68:1 (AAA)

11-Step Tints & Shades Scale (Tailwind 50–950)

Mathematically balanced luminance scale for design tokens and CSS color palettes. Click any shade to copy hex code:

50
#FDF7EC
100
#FCF0DA
200
#F8E0B4
300
#F4CD86
400
#EFB64E
500
#EAA221
600
#C78812
700
#9E6C0F
800
#744F0B
900
#4E3507
950
#2C1E04

Color Harmonies & Palette Schemes

Complementary

#1F66EA
Opposite 180° Contrast

Analogous -30°

#EA3D1F
Natural Harmony

Analogous +30°

#CCEA1F
Natural Harmony

Triadic +120°

#1FEAA3
120° Balanced Triad

Triadic +240°

#A31FEA
120° Balanced Triad

Curated UI Design Pairings for Marigold

High-visibility CTA button, banner accent, and badge color for creative portfolios, delivery platforms, and joyful consumer apps. Strong contrast against navy and charcoal.

Deep Indigo Navy
#1E1B4B
Maximum Contrast Heading
Pure White
#FFFFFF
Crisp Button Label
Warm Cream
#FEF9C3
Sunny Card Container
Burnt Amber
#9A3412
Energetic Border

Export Marigold Code Snippets

CSS Variable --color-marigold-color: #EAA221;
Tailwind Config 'marigold-color': '#EAA221'
Swift / SwiftUI Color(hex: "#EAA221")
JSON Design Token {"name": "Marigold", "hex": "#EAA221"}

Frequently Asked Questions About Marigold (#EAA221)

What is the exact HEX code for Marigold?

The exact HEX code for Marigold is #EAA221. In 8-digit hexadecimal (with 100% opacity), it is #EAA221FF. Its RGB decimal equivalent is rgb(234, 162, 33) and its HSL value is hsl(39deg, 83%, 52%).

What colors go best with Marigold in UI and web design?

Marigold pairs exceptionally well with Deep Indigo Navy (#1E1B4B), Pure White (#FFFFFF), Warm Cream (#FEF9C3), and Burnt Amber (#9A3412).

How do I use Marigold in CSS and Tailwind CSS?

In standard CSS, apply it directly via color: #EAA221; or background-color: #EAA221;. In Tailwind CSS, use arbitrary value syntax like bg-[#eaa221] or text-[#eaa221], or define it in your Tailwind v4 @theme block as --color-marigold-color: #EAA221;.

Is Marigold WCAG accessible for readable text?

Against a pure white background (#FFFFFF), Marigold achieves a contrast ratio of 2.17:1 (Fail). Against a pure black background (#000000), it achieves 9.68:1 (AAA). Check custom contrast pairings on Pikka's WCAG Contrast Checker.

Explore More Colors in the Dictionary

Browse our complete catalog of curated named colors, harmonic palettes, and accessible UI combinations.

Named Color Dictionary Interactive Color Wheel Tint & Shade Generator