Palette

Wild Orchid Trail

Captures the vivid, unexpected beauty of exotic wild orchids found deep within a lush jungle.

vibrantnatural5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Wild Orchid Trail 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 Wild Orchid Trail.

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

Data visualization

#FF00FF#8A2BE2#32CD32#F5DEB3#8B4513

Palette guide

How to use Wild Orchid Trail

Overview

The Wild Orchid Trail palette captures the vivid, unexpected beauty of exotic wild orchids found deep within a lush jungle. This vibrant and eclectic collection features a striking #FF00FF (pure magenta), a mysterious #8A2BE2 (blue violet), a fresh #32CD32 (lime green), a warm #F5DEB3 (wheat), and a grounding #8B4513 (saddle brown). For designers, these bold hues offer a dynamic range for creating energetic and adventurous visuals. Developers can leverage this palette to build engaging interfaces that evoke exploration and natural wonder, perfect for projects requiring a sense of excitement and tropical flair.

Best used for

Adventure travel and eco-tourism branding
Exotic product lines and packaging
Creative agency and festival branding
Nature documentary and wildlife conservation sites
Digital art and vibrant illustrations
Interactive experiences with a tropical theme

Suggested color roles

primary

Use #FF00FF as a bold primary color for high-impact branding, call-to-action elements, or to convey excitement and energy.

secondary

Employ #32CD32 for secondary elements, subheadings, or to introduce a vibrant natural contrast to the magenta.

accent

Apply #8B4513 for grounding accents, rich text, or to anchor the vibrant colors with an earthy, natural tone.

background

Utilize #F5DEB3 as a warm, neutral background, providing a subtle canvas that allows the vivid orchid colors to pop.

text

For optimal readability, use #8B4513 or black for body text. #8A2BE2 can be used for prominent headlines on light backgrounds.

Accessibility notes

Exercise caution when using #FF00FF and #32CD32 for large blocks of text, as their high vibrancy can be challenging to read.
Ensure strong contrast for text against #F5DEB3; #8B4513 provides excellent readability.
Avoid using #F5DEB3 for small text sizes, as it may not meet WCAG contrast requirements.
Test color combinations thoroughly, especially for users with color vision deficiencies, due to the high saturation.

Recommended combinations

Tropical Highlight

A striking combination for hero banners, with #F5DEB3 as background, #FF00FF for headlines, and #32CD32 for accents.

#FF00FF · #F5DEB3 · #32CD32

Jungle Path

Creates an adventurous feel for navigation or content sections, evoking natural elements.

#8B4513 · #32CD32 · #F5DEB3

Vibrant UI

A balanced trio for user interfaces, using #F5DEB3 for panels, #8A2BE2 for buttons, and #FF00FF for interactive highlights.

#F5DEB3 · #8A2BE2 · #FF00FF

CSS variables

:root {
  --wild-orchid-trail-1: #FF00FF;
  --wild-orchid-trail-2: #8A2BE2;
  --wild-orchid-trail-3: #32CD32;
  --wild-orchid-trail-4: #F5DEB3;
  --wild-orchid-trail-5: #8B4513;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "wild-orchid-trail": {
        1: "#FF00FF",
        2: "#8A2BE2",
        3: "#32CD32",
        4: "#F5DEB3",
        5: "#8B4513",
      }
    }
  }
}

Hex values

Color 1#FF00FF

Color 2#8A2BE2

Color 3#32CD32

Color 4#F5DEB3

Color 5#8B4513

Accessibility

Contrast checker

1.9:1Fail

1.5:1Fail

2.4:1Fail

2.3:1Fail

1.9:1Fail

2.8:1Fail

4.5:1AA

1.2:1Fail

1.5:1Fail

2.8:1Fail

1.6:1Fail

3.4:1AA18

2.4:1Fail

4.5:1AA

1.6:1Fail

5.4:1AA

2.3:1Fail

1.2:1Fail

3.4:1AA18

5.4:1AA

Similar palettes

More like Wild Orchid Trail

Tropical Forest Glade

Arid Cactus Blossom

Cactus Blossom Kiss