Back to palettes

Palette

Fairy Tale Cottage

Soft greens and gentle pinks conjure images of an enchanted cottage nestled in a whimsical fairy tale forest.

PastelPlayful5 colors
More Pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Fairy Tale Cottage 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 Fairy Tale Cottage.

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

Data visualization

#DCEDC8#C5E1A5#A5D6A7#9CCC65#F8BBD0

Palette guide

How to use Fairy Tale Cottage

Overview

The Fairy Tale Cottage palette (version 4) brings together soft greens and gentle pinks to conjure images of an enchanted dwelling nestled in a whimsical forest. Featuring vibrant greens like #A5D6A7 and #9CCC65, alongside the delicate light green #DCEDC8, this palette grounds itself in nature. The soft pink #F8BBD0 adds a touch of playful romance, creating a balanced and inviting scheme. Designers and developers can use these hues to build serene digital environments, charming branding, or evocative illustrations that capture a truly magical and innocent mood.

Best used for

  • Eco-friendly product branding
  • Nature-inspired web design
  • Children's learning applications
  • Spring event decor and invitations
  • Organic food packaging
  • Garden-themed marketing materials

Suggested color roles

primary

Use #A5D6A7 (Medium Green) as the foundational color for main content areas or primary branding, offering a calming, earthy base.

secondary

Employ #9CCC65 (Lime Green) for energetic accents, prominent calls-to-action, or to represent growth and vitality.

accent

Apply #F8BBD0 (Light Pink) for whimsical highlights, decorative elements, or to introduce a gentle, playful contrast.

background

Utilize #DCEDC8 (Pale Green) as a light, airy background, ensuring excellent readability for darker text.

text

Dark green or charcoal gray provides optimal readability for body text. White or very light gray can be used on #9CCC65 for headings.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using #DCEDC8 with light text colors.
  • Darker text is recommended for legibility against #C5E1A5 and #A5D6A7 to meet accessibility standards.
  • When using #F8BBD0, ensure any text or icons overlaid on it have adequate contrast.
  • Avoid using very light gray text on #DCEDC8, as it may be difficult to read for some users.

Recommended combinations

Forest Path

Ideal for natural landscapes, layered design elements, or gradients that evoke depth in a forest setting.

#9CCC65 · #A5D6A7 · #DCEDC8

Floral Whimsy

Perfect for decorative elements, feminine accents, or branding that emphasizes softness and natural beauty.

#F8BBD0 · #C5E1A5 · #DCEDC8

Gentle Gradient

Effective for background fills, subtle depth in UI components, or creating smooth visual transitions.

#A5D6A7 · #C5E1A5 · #9CCC65

CSS variables

:root {
  --fairy-tale-cottage-4-1: #DCEDC8;
  --fairy-tale-cottage-4-2: #C5E1A5;
  --fairy-tale-cottage-4-3: #A5D6A7;
  --fairy-tale-cottage-4-4: #9CCC65;
  --fairy-tale-cottage-4-5: #F8BBD0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "fairy-tale-cottage-4": {
        1: "#DCEDC8",
        2: "#C5E1A5",
        3: "#A5D6A7",
        4: "#9CCC65",
        5: "#F8BBD0",
      }
    }
  }
}

Related searches

enchanted forest palettewhimsical green pinknature inspired pastelsfairytale garden colorssoft organic scheme

Palette colors

Hex values

Color 1#DCEDC8
·
Color 2#C5E1A5
·
Color 3#A5D6A7
·
Color 4#9CCC65
·
Color 5#F8BBD0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.3:1Fail
1.5:1Fail
1.3:1Fail
2
1.2:1Fail
1.1:1Fail
1.3:1Fail
1.1:1Fail
3
1.3:1Fail
1.1:1Fail
1.1:1Fail
1:1Fail
4
1.5:1Fail
1.3:1Fail
1.1:1Fail
1.2:1Fail
5
1.3:1Fail
1.1:1Fail
1:1Fail
1.2:1Fail

Similar palettes

More like Fairy Tale Cottage

View all Pastel