Back to palettes

Palette

Lollipop Swirl Dreams

A delightful fantasy of swirling colors, like an assortment of vibrant, sugary lollipops come to life.

vibrantplayful5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Lollipop Swirl Dreams 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 Lollipop Swirl Dreams.

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

Data visualization

#F4D03F#FF8C94#77DD77#84B6F4#F79E8E

Palette guide

How to use Lollipop Swirl Dreams

Overview

The 'Lollipop Swirl Dreams' palette is a delightful fantasy of vibrant, swirling colors, like an assortment of sugary lollipops come to life. Featuring a cheerful yellow #F4D03F, a lively coral #FF8C94, a fresh green #77DD77, a bright sky blue #84B6F4, and a warm peachy orange #F79E8E, this palette is perfect for creating energetic, playful, and highly engaging designs. Designers can leverage these bold shades to infuse projects with a dynamic and fun aesthetic, while developers will find them ideal for building eye-catching interfaces that captivate users across web and mobile platforms.

Best used for

  • Children's educational apps
  • Creative agency branding
  • Event promotion materials
  • Fun social media campaigns
  • Casual gaming interfaces
  • Youth-focused product packaging

Suggested color roles

primary

#F4D03F - A bright, optimistic yellow, excellent for primary calls-to-action, headers, or backgrounds where energy is desired.

secondary

#FF8C94 - A lively coral, perfect for secondary calls-to-action, highlights, or graphical elements that need a warm, inviting pop.

accent

#77DD77 - A fresh, vibrant green, highly effective for success indicators, interactive elements, or to provide a sharp, cheerful contrast.

background

#84B6F4 - A clear sky blue, serving as a versatile backdrop for content, offering a refreshing and playful base.

text

#F79E8E - A warm peachy orange, suitable for large decorative headings. For body text, use a dark grey or black for optimal readability, as these vibrant colors have low contrast with light backgrounds.

Accessibility notes

  • Most vibrant colors have low contrast with white or light backgrounds; use dark text (black or charcoal) for all essential information.
  • #F4D03F, #FF8C94, #77DD77, #84B6F4, #F79E8E will all need sufficient contrast when used as text colors; they are best for backgrounds or large decorative elements.
  • Ensure interactive elements have clear focus states and sufficient contrast against their background.
  • Consider using one of the palette colors for backgrounds and a stark black/white for text to ensure readability.

Recommended combinations

Vibrant Fun

Creates an energetic and cheerful combination for headers, illustrations, and key UI elements.

#F4D03F · #FF8C94 · #77DD77

Playful Contrast

Ideal for dynamic backgrounds, callouts, and eye-catching graphic elements.

#84B6F4 · #F79E8E · #F4D03F

Sweet Harmony

Provides a balanced yet lively mix for sections, interactive buttons, and playful content blocks.

#FF8C94 · #77DD77 · #84B6F4

CSS variables

:root {
  --lollipop-swirl-dreams-1: #F4D03F;
  --lollipop-swirl-dreams-2: #FF8C94;
  --lollipop-swirl-dreams-3: #77DD77;
  --lollipop-swirl-dreams-4: #84B6F4;
  --lollipop-swirl-dreams-5: #F79E8E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "lollipop-swirl-dreams": {
        1: "#F4D03F",
        2: "#FF8C94",
        3: "#77DD77",
        4: "#84B6F4",
        5: "#F79E8E",
      }
    }
  }
}

Related searches

vibrant playful color schemecandy shop palettebright colorful ui designfun web colorslollipop inspired branding

Palette colors

Hex values

Color 1#F4D03F
·
Color 2#FF8C94
·
Color 3#77DD77
·
Color 4#84B6F4
·
Color 5#F79E8E
·

Accessibility

Contrast checker

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

Similar palettes

More like Lollipop Swirl Dreams

View all vibrant
Playful Jellybean Row
Whimsical Candy Burst
Candy Block Fun
Gumball Machine Gleam
Gummy Bear Blast
Gummy Bear Rainbow