Back to palettes

Palette

Pop Art Cityscape

A dynamic and audacious palette, mirroring the iconic, high-contrast visuals of pop art and urban energy.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Pop Art Cityscape 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 Pop Art Cityscape.

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

Data visualization

#F44336#E91E63#9C27B0#2196F3#FFEB3B

Palette guide

How to use Pop Art Cityscape

Overview

The "Pop Art Cityscape" palette is an audacious collection of five vibrant hues, perfectly capturing the dynamic energy and high-contrast visuals reminiscent of pop art and bustling urban environments. Featuring a striking red (#F44336), a passionate pink (#E91E63), a deep violet (#9C27B0), an electric blue (#2196F3), and a sunny yellow (#FFEB3B), this palette is designed to make a bold statement. Designers and developers can leverage these intense colors to create designs that are both eye-catching and memorable, evoking a sense of modern urban flair and playful rebellion. Its inherent vibrancy encourages creative applications where impact is paramount.

Best used for

  • Event posters and flyers
  • Youth-oriented brand identities
  • Digital marketing campaigns (banners, ads)
  • Mobile application interfaces (UI)
  • Editorial illustrations and infographics
  • Gaming UI and promotional materials

Suggested color roles

primary

#F44336 (Red) - Ideal for commanding attention on hero sections, call-to-action buttons, or main headlines, conveying urgency and excitement.

secondary

#2196F3 (Blue) - Excellent for supporting elements, navigation links, or graphical accents, offering a cool contrast to the primary red.

accent

#FFEB3B (Yellow) - Use sparingly for highlights, warnings, interactive states, or small decorative elements to add a jolt of pure energy.

background

#9C27B0 (Violet) - A dramatic choice for a bold background in specific sections or full-page takeovers, or pair with a near-white background for strong visual contrast.

text

For maximum legibility against the vibrant colors, a dark charcoal or pure black text is recommended. For lighter backgrounds, #9C27B0 or #2196F3 can be effective for headings.

Accessibility notes

  • Ensure sufficient contrast between text and background colors, especially when using lighter palette colors for text against bright backgrounds.
  • Avoid using #F44336 (Red) and #E91E63 (Pink) directly adjacent for critical information, as their similar luminance can challenge color-blind users.
  • Test all color combinations with accessibility checkers to meet WCAG AA or AAA standards for readability, particularly for body text.
  • Provide alternative text for color-coded information, as the vibrancy can sometimes mask distinctions for users with visual impairments.

Recommended combinations

Pop Energy

Creates an immediate, high-energy impact, perfect for attention-grabbing headlines or interactive elements.

#F44336 · #FFEB3B · #2196F3

Urban Bold

A rich, deep combination that feels sophisticated yet vibrant, suitable for modern branding or editorial design.

#9C27B0 · #E91E63 · #F44336

Vibrant Contrast

Offers a playful and lively feel, excellent for illustrations, data visualization, or youth-focused digital content.

#2196F3 · #FFEB3B · #E91E63

CSS variables

:root {
  --pop-art-cityscape-1: #F44336;
  --pop-art-cityscape-2: #E91E63;
  --pop-art-cityscape-3: #9C27B0;
  --pop-art-cityscape-4: #2196F3;
  --pop-art-cityscape-5: #FFEB3B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pop-art-cityscape": {
        1: "#F44336",
        2: "#E91E63",
        3: "#9C27B0",
        4: "#2196F3",
        5: "#FFEB3B",
      }
    }
  }
}

Related searches

vibrant color schemespop art color palettebold digital colorsurban design paletteenergetic branding colors

Palette colors

Hex values

Color 1#F44336
·
Color 2#E91E63
·
Color 3#9C27B0
·
Color 4#2196F3
·
Color 5#FFEB3B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.7:1Fail
1.2:1Fail
3:1AA18
2
1.2:1Fail
1.5:1Fail
1.4:1Fail
3.6:1AA18
3
1.7:1Fail
1.5:1Fail
2:1Fail
5.2:1AA
4
1.2:1Fail
1.4:1Fail
2:1Fail
2.6:1Fail
5
3:1AA18
3.6:1AA18
5.2:1AA
2.6:1Fail

Similar palettes

More like Pop Art Cityscape

View all vibrant