Palette

Bright Marigold Bloom

A joyful explosion of oranges and yellows, reminiscent of marigold blooms under a cheerful sun.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Bright Marigold Bloom reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Bright Marigold Bloom.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#FF8C00#FFD700#FFA500#DAA520#F0E68C

Palette guide

How to use Bright Marigold Bloom

Overview

The Bright Marigold Bloom palette is a joyful explosion of oranges and yellows, reminiscent of marigold blooms under a cheerful sun. Featuring #FF8C00 (dark orange), #FFD700 (gold), #FFA500 (orange), #DAA520 (goldenrod), and #F0E68C (light goldenrod), this scheme is inherently warm and inviting. Designers and developers will find this palette excellent for projects that need to convey happiness, celebration, and a natural, vibrant energy, making it perfect for festive or nature-inspired themes.

Best used for

Summer and autumn branding campaigns
Floral designs and garden-themed products
Cultural celebrations (e.g., Diwali, Dia de los Muertos)
Food packaging (citrus, spices, baked goods)
Cheerful web elements and call-to-action buttons
Crafts and DIY project inspiration

Suggested color roles

primary

Use #FF8C00 for impactful headlines or main calls to action, drawing attention with its warm intensity.

secondary

Employ #FFD700 and #FFA500 for supporting graphics, subheadings, or larger sections, maintaining a bright and cheerful tone.

accent

Apply #DAA520 for subtle depth and texture, and #F0E68C for gentle highlights or soft background areas.

background

A very light cream or #F0E68C can serve as a soft, luminous background, allowing the brighter oranges and yellows to shine.

text

Dark brown or charcoal (#4A4A4A) is recommended for body text to ensure clear readability against the predominantly light and warm palette.

Accessibility notes

Lighter shades like #FFD700 and #F0E68C will require dark text for sufficient contrast and readability.
Ensure #FF8C00 and #FFA500 have adequate contrast when paired with white text; larger font sizes are preferable.
Avoid using #F0E68C for small text, as its lightness can make it difficult to read without strong contrast.
Always verify color contrast for all text and interactive elements to ensure accessibility for all users.

Recommended combinations

Sunny Glow

Creates a soft, radiant, and warm gradient, ideal for inviting background elements or gentle branding.

#FFD700 · #FFA500 · #F0E68C

Marigold Burst

A bold, natural, and energetic combination, perfect for highlighting key features or calls to action.

#FF8C00 · #DAA520 · #FFD700

Golden Hour

Offers a rich, earthy, and sophisticated feel, suitable for elegant accents or textured designs.

#FFA500 · #DAA520 · #F0E68C

CSS variables

:root {
  --bright-marigold-bloom-1: #FF8C00;
  --bright-marigold-bloom-2: #FFD700;
  --bright-marigold-bloom-3: #FFA500;
  --bright-marigold-bloom-4: #DAA520;
  --bright-marigold-bloom-5: #F0E68C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "bright-marigold-bloom": {
        1: "#FF8C00",
        2: "#FFD700",
        3: "#FFA500",
        4: "#DAA520",
        5: "#F0E68C",
      }
    }
  }
}

Hex values

Color 1#FF8C00

Color 2#FFD700

Color 3#FFA500

Color 4#DAA520

Color 5#F0E68C

Accessibility

Contrast checker

1.7:1Fail

1.2:1Fail

1:1Fail

1.8:1Fail

1.7:1Fail

1.4:1Fail

1.6:1Fail

1.1:1Fail

1.2:1Fail

1.4:1Fail

1.1:1Fail

1.5:1Fail

1:1Fail

1.6:1Fail

1.1:1Fail

1.7:1Fail

1.8:1Fail

1.1:1Fail

1.5:1Fail

1.7:1Fail

Similar palettes

More like Bright Marigold Bloom

Bright Marigold Bloom

See it in context.

Ready when you are.

Built with Bright Marigold Bloom.

How to use Bright Marigold Bloom

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Sunny Glow

Marigold Burst

Golden Hour

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Bright Marigold Bloom