Back to palettes

Palette

Lavender Fields Dream

Soft, dreamy purples inspired by vast lavender fields swaying gently under a peaceful, afternoon sky.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lavender Fields Dream 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 Lavender Fields Dream.

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

Data visualization

#6A5ACD#9370DB#B19CD9#C8A2C8#E0BBE4

Palette guide

How to use Lavender Fields Dream

Overview

The Lavender Fields Dream palette offers a harmonious gradient of purples, from deep and regal to soft and ethereal, capturing the essence of a peaceful afternoon in a blooming field. Featuring the rich #6A5ACD, the elegant #9370DB, the gentle #B19CD9, the comforting #C8A2C8, and the delicate #E0BBE4, this collection is perfect for dreamy and sophisticated designs. Designers can use it for luxurious branding, inviting digital interfaces, or charming illustrations. Developers will find these hex codes provide excellent opportunities for creating visual depth and clear hierarchy, ensuring a cohesive and engaging user experience across various platforms. Its inherent versatility supports both subtle and prominent visual communication.

Best used for

  • Luxurious beauty product branding
  • Wedding and event planning sites
  • Fashion and lifestyle blogs
  • Artistic digital illustrations
  • Meditation and relaxation apps
  • Sophisticated packaging design

Suggested color roles

primary

Let #9370DB serve as the main color for headings, prominent UI components, or a brand's signature element, offering depth and elegance.

secondary

Utilize #B19CD9 for supporting content, subheadings, or secondary interactive elements, providing a gentle yet harmonious contrast.

accent

Employ #6A5ACD for calls to action, key highlights, or subtle design details that require a richer, more distinguished pop.

background

The lightest shade, #E0BBE4, is excellent for clean, calming backgrounds, offering a soft canvas that lets other colors shine.

text

For body text on light backgrounds like #E0BBE4, a dark charcoal or black is recommended. For headings, #6A5ACD provides sophisticated readability.

Accessibility notes

  • Ensure #6A5ACD or #9370DB text on #E0BBE4 backgrounds meets WCAG AA contrast requirements for optimal readability.
  • Avoid low-contrast pairings such as #C8A2C8 with #E0BBE4 for critical information to prevent readability issues.
  • Prioritize using the deepest colors for essential interactive elements and textual content to enhance clickability and readability.
  • Test color combinations with various user settings, including high contrast modes, to ensure broad accessibility for all users.

Recommended combinations

Ethereal Flow

Create soft, flowing gradients for banners, hero sections, or background elements, transitioning smoothly from light to medium purple.

#E0BBE4 · #C8A2C8 · #B19CD9

Regal Depth

Apply these for robust UI elements, card designs, or strong brand accents, building visual hierarchy with deepening purples.

#B19CD9 · #9370DB · #6A5ACD

Dreamy Contrast

Use #E0BBE4 as a clean background, #9370DB for main content, and #6A5ACD for impactful calls to action or key visual anchors.

#E0BBE4 · #9370DB · #6A5ACD

CSS variables

:root {
  --lavender-fields-dream-3-1: #6A5ACD;
  --lavender-fields-dream-3-2: #9370DB;
  --lavender-fields-dream-3-3: #B19CD9;
  --lavender-fields-dream-3-4: #C8A2C8;
  --lavender-fields-dream-3-5: #E0BBE4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lavender-fields-dream-3": {
        1: "#6A5ACD",
        2: "#9370DB",
        3: "#B19CD9",
        4: "#C8A2C8",
        5: "#E0BBE4",
      }
    }
  }
}

Related searches

dreamy purple color paletteregal lavender schemeelegant pastel purplessophisticated floral designgentle purple branding

Palette colors

Hex values

Color 1#6A5ACD
·
Color 2#9370DB
·
Color 3#B19CD9
·
Color 4#C8A2C8
·
Color 5#E0BBE4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.2:1Fail
2.4:1Fail
3.1:1AA18
2
1.4:1Fail
1.5:1Fail
1.7:1Fail
2.2:1Fail
3
2.2:1Fail
1.5:1Fail
1.1:1Fail
1.4:1Fail
4
2.4:1Fail
1.7:1Fail
1.1:1Fail
1.3:1Fail
5
3.1:1AA18
2.2:1Fail
1.4:1Fail
1.3:1Fail

Similar palettes

More like Lavender Fields Dream

View all pastel
Dreamy Lavender Field
Lavender Haze Field
Dreamy Lavender Field
Lavender Bloom Field
Lavender Bloom Field
Lavender Bloom Fields