Palette

Mural Alley Pop

Bold and expressive, mirroring the vivid splash of colors found in playful street art.

vibrantplayful5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mural Alley Pop 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 Mural Alley Pop.

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

Data visualization

#FF0000#00FF00#0000FF#FFFF00#FF69B4

Palette guide

How to use Mural Alley Pop

Overview

The Mural Alley Pop palette bursts with raw, vibrant energy, capturing the essence of dynamic street art. Featuring bold primary colors like striking #FF0000 (Red), electric #00FF00 (Green), and vivid #0000FF (Blue), it's complemented by sunny #FFFF00 (Yellow) and playful #FF69B4 (Hot Pink). This collection is perfect for designers and developers aiming to create high-impact, youthful, and energetic interfaces or marketing materials. Its strong contrasts and pure hues make it ideal for designs that demand attention and evoke a sense of excitement and creativity, reminiscent of urban artistic expression.

Best used for

Youthful brand identities and logos
Digital art and illustration
Event posters and promotional materials
Game user interfaces and character design
Children's product packaging
Interactive web elements and calls to action

Suggested color roles

primary

Use #FF0000 as a dominant color for strong statements, headlines, or key interactive elements that demand immediate attention.

secondary

Employ #0000FF to provide a powerful complementary contrast, ideal for sections, subheadings, or secondary buttons, maintaining high energy.

accent

Apply #FFFF00 for bright highlights, small details, or calls to action where maximum visibility and a cheerful pop are desired.

background

A vibrant background like #00FF00 can create an immersive, playful environment. Alternatively, pair with a neutral dark or white to let the other colors truly pop.

text

For optimal readability, use a stark black (e.g., #000000) or pure white (e.g., #FFFFFF) for text, ensuring high contrast against the vivid palette colors.

Accessibility notes

Ensure sufficient contrast for text, especially when pairing vibrant colors like #00FF00 and #FFFF00, by using a dark text color.
Avoid using pure red (#FF0000) text on a pure green (#00FF00) background, or vice-versa, for users with color vision deficiencies.
Leverage the strong contrast between colors for visual hierarchy, but be mindful of potential eye strain with large blocks of complementary bright hues.
Use a tool to check WCAG contrast ratios, particularly for smaller text sizes, against all chosen background colors.

Recommended combinations

Urban Pop

A classic, high-energy trio ideal for primary branding, icons, and bold graphic elements.

#FF0000 · #0000FF · #FFFF00

Neon Alley

Creates a modern, playful, and slightly edgy feel, excellent for digital illustrations or interactive states.

#00FF00 · #FF69B4 · #0000FF

Vibrant Statement

Combines warmth and intensity, perfect for eye-catching headlines, banners, or youthful marketing campaigns.

#FF0000 · #FF69B4 · #FFFF00

CSS variables

:root {
  --mural-alley-pop-1: #FF0000;
  --mural-alley-pop-2: #00FF00;
  --mural-alley-pop-3: #0000FF;
  --mural-alley-pop-4: #FFFF00;
  --mural-alley-pop-5: #FF69B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mural-alley-pop": {
        1: "#FF0000",
        2: "#00FF00",
        3: "#0000FF",
        4: "#FFFF00",
        5: "#FF69B4",
      }
    }
  }
}

Hex values

Color 1#FF0000

Color 2#00FF00

Color 3#0000FF

Color 4#FFFF00

Color 5#FF69B4

Accessibility

Contrast checker

2.9:1Fail

2.1:1Fail

3.7:1AA18

1.5:1Fail

2.9:1Fail

6.3:1AA

1.3:1Fail

1.9:1Fail

2.1:1Fail

6.3:1AA

8:1AAA

3.2:1AA18

3.7:1AA18

1.3:1Fail

8:1AAA

2.5:1Fail

1.5:1Fail

1.9:1Fail

3.2:1AA18

2.5:1Fail

Similar palettes

More like Mural Alley Pop

View all vibrant

Bright Carnival Spin

Bright Fairground Lights

Building Blocks Bright

Candy Wrapper Pop

Carnival Bright Spark

Carnival Carousel Ride