Back to palettes

Palette

Spring Crocus

Gentle lavenders and lilacs blossom forth, capturing the delicate beauty of early spring flowers.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Spring Crocus 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 Spring Crocus.

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

Data visualization

#9370DB#C8A2C8#DDA0DD#BA55D3#8A2BE2

Palette guide

How to use Spring Crocus

Overview

The Spring Crocus palette is a delightful collection of gentle lavenders and vibrant lilacs, perfectly capturing the delicate yet playful beauty of early spring flowers. Featuring the rich #9370DB, a softer #C8A2C8, the classic #DDA0DD, the bright #BA55D3, and the deep #8A2BE2, this palette offers a versatile range of purples. It’s an ideal choice for designers looking to create playful, whimsical, or softly elegant visuals. The harmonious blend of these purple tones allows for designs that feel both serene and energetic, making it suitable for a variety of applications from digital interfaces to charming print materials.

Best used for

  • Creative branding for children's products or services
  • Whimsical digital illustrations and art
  • Spring festival or event promotions
  • Fashion and accessory design, especially for playful styles
  • Feminine tech product interfaces
  • Artistic website backgrounds and UI elements

Suggested color roles

primary

Use #BA55D3 as a vibrant primary accent for buttons or key call-to-action elements, offering a cheerful and noticeable focal point.

secondary

Employ #9370DB for larger content blocks or secondary navigation, providing a rich and grounding purple base.

accent

Introduce #8A2BE2 for strong accents, icons, or important visual cues, adding depth and sophistication.

background

Utilize #DDA0DD or #C8A2C8 for soft, inviting backgrounds that ensure good readability for darker text.

text

For optimal readability, pair these purples with dark charcoal or black text. White text works well on #9370DB and #8A2BE2.

Accessibility notes

  • Ensure sufficient contrast for text on lighter purples like #DDA0DD and #C8A2C8; dark text is recommended.
  • White text can be used effectively on the darker purples like #9370DB and #8A2BE2, but verify contrast.
  • Avoid using mid-tone purples for small text unless on a very high-contrast background to maintain legibility.
  • Test all interactive elements for WCAG compliance, ensuring clear hover/focus states with adequate contrast.

Recommended combinations

Purple Blossom

Creates a harmonious gradient from light to deep purple, perfect for headers or branding elements.

#DDA0DD · #BA55D3 · #9370DB

Vibrant Lilac

Offers a dynamic and playful contrast, ideal for energetic designs or feature highlights.

#C8A2C8 · #8A2BE2 · #BA55D3

Soft & Deep

Provides a sophisticated blend of light and deep purples, suitable for elegant interfaces or print.

#DDA0DD · #9370DB · #8A2BE2

CSS variables

:root {
  --spring-crocus-1: #9370DB;
  --spring-crocus-2: #C8A2C8;
  --spring-crocus-3: #DDA0DD;
  --spring-crocus-4: #BA55D3;
  --spring-crocus-5: #8A2BE2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "spring-crocus": {
        1: "#9370DB",
        2: "#C8A2C8",
        3: "#DDA0DD",
        4: "#BA55D3",
        5: "#8A2BE2",
      }
    }
  }
}

Related searches

purple spring flower palettelilac color scheme designplayful purple pastelscrocus inspired colorsvibrant lavender palette

Palette colors

Hex values

Color 1#9370DB
·
Color 2#C8A2C8
·
Color 3#DDA0DD
·
Color 4#BA55D3
·
Color 5#8A2BE2
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
1.8:1Fail
1:1Fail
1.6:1Fail
2
1.7:1Fail
1.1:1Fail
1.8:1Fail
2.7:1Fail
3
1.8:1Fail
1.1:1Fail
1.9:1Fail
2.9:1Fail
4
1:1Fail
1.8:1Fail
1.9:1Fail
1.5:1Fail
5
1.6:1Fail
2.7:1Fail
2.9:1Fail
1.5:1Fail

Similar palettes

More like Spring Crocus

View all pastel
Sweet Pea Delight
Cherry Blossom Cloud
Cherry Blossom Dream
Enchanted Bloom Veil
Fairy Glen Bloom
Pastel Blossom Array