Palette

Cactus Flower Bloom

A striking contrast of vibrant purples, pinks, and greens, celebrating the unexpected beauty of desert flora.

vibrantenergetic5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cactus Flower 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 Cactus Flower Bloom.

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

Data visualization

#8B008B#DA70D6#90EE90#FFD700#556B2F

Palette guide

How to use Cactus Flower Bloom

Overview

The Cactus Flower Bloom palette is a striking collection of vibrant purples, pinks, and greens, celebrating the unexpected beauty of desert flora. This energetic palette features a deep, regal violet, #8B008B, and a softer lavender, #DA70D6, capturing the essence of exotic blooms. These are brilliantly contrasted with a lively pastel green, #90EE90, and a radiant gold, #FFD700, reminiscent of bright sunlight. A grounding forest green, #556B2F, provides a natural anchor. Designers will find this palette excellent for creating bold, playful, and vividly imaginative visuals. Developers can use these colors to build dynamic and eye-catching user interfaces for creative brands, entertainment, or anything requiring a cheerful and distinct personality.

Best used for

Creative branding and packaging
Event and festival promotions
Children's products and media
Art and design portfolios
Vibrant digital illustrations
Fashion accessories design

Suggested color roles

primary

Utilize #90EE90 as a fresh, lively primary background or base color, providing a natural and energetic feel.

secondary

Apply #DA70D6 for secondary elements, offering a soft yet distinct purple that complements the green.

accent

Introduce #8B008B or #FFD700 as powerful, high-impact accents for calls to action, headlines, or key visual elements.

background

Employ #90EE90 for bright, inviting backgrounds, allowing the bolder colors to truly stand out.

text

Use #556B2F for main body text and headings, ensuring strong readability and a grounded, natural contrast. Dark charcoal also works well.

Accessibility notes

Ensure high contrast when pairing text in #8B008B or #556B2F with backgrounds like #90EE90 or #FFD700.
Avoid using #DA70D6 for small text on #90EE90 as the contrast may be insufficient for WCAG AA compliance.
The bright #FFD700 should be used with caution for text; ensure it has enough contrast against its background.
For interactive elements, use colors like #8B008B or #556B2F to provide clear visual cues and sufficient contrast.

Recommended combinations

Vivid Bloom

Creates a bold and energetic focal point, combining deep purple, bright green, and radiant gold, ideal for hero sections.

#8B008B · #90EE90 · #FFD700

Desert Radiance

Offers a lively yet grounded feel, blending sunny gold with soft purple and deep green, suitable for headers or distinct sections.

#FFD700 · #DA70D6 · #556B2F

Botanical Pop

Combines fresh green with a deep purple accent and a rich green for text, excellent for natural themes with a punch.

#90EE90 · #8B008B · #556B2F

CSS variables

:root {
  --cactus-flower-bloom-1: #8B008B;
  --cactus-flower-bloom-2: #DA70D6;
  --cactus-flower-bloom-3: #90EE90;
  --cactus-flower-bloom-4: #FFD700;
  --cactus-flower-bloom-5: #556B2F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cactus-flower-bloom": {
        1: "#8B008B",
        2: "#DA70D6",
        3: "#90EE90",
        4: "#FFD700",
        5: "#556B2F",
      }
    }
  }
}

Hex values

Color 1#8B008B

Color 2#DA70D6

Color 3#90EE90

Color 4#FFD700

Color 5#556B2F

Accessibility

Contrast checker

2.9:1Fail

6:1AA

6.1:1AA

1.4:1Fail

2.9:1Fail

2:1Fail

2.1:1Fail

6:1AA

2:1Fail

1:1Fail

4.2:1AA18

6.1:1AA

2.1:1Fail

1:1Fail

4.2:1AA18

1.4:1Fail

2.1:1Fail

4.2:1AA18

Similar palettes

More like Cactus Flower Bloom

Cactus Flower Bloom

See it in context.

Ready when you are.

Built with Cactus Flower Bloom.

How to use Cactus Flower Bloom

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Vivid Bloom

Desert Radiance

Botanical Pop

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Cactus Flower Bloom