Back to palettes

Palette

Vibrant Street Art

A dynamic burst of primary and secondary colors, reflecting the bold and expressive energy of urban street art.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Vibrant Street Art 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 Vibrant Street Art.

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

Data visualization

#FF0000#FFD700#00FF00#0000FF#8A2BE2

Palette guide

How to use Vibrant Street Art

Overview

The Vibrant Street Art palette is a dynamic and bold explosion of primary and secondary colors, directly reflecting the expressive energy of urban graffiti. Featuring striking red #FF0000, brilliant gold #FFD700, vivid lime green #00FF00, powerful blue #0000FF, and an artistic blue-violet #8A2BE2, this collection is perfect for designers and developers aiming to create impactful, modern, and rebellious visuals. It's a high-energy palette that commands attention and conveys a sense of creativity and urban culture. Use these saturated hues to inject raw vibrancy and a youthful spirit into any digital or print project, making a memorable statement.

Best used for

  • Streetwear and urban fashion brands
  • Music event promotion and festival branding
  • Youth-oriented apps and digital platforms
  • Digital art, illustrations, and motion graphics
  • Bold website hero sections and landing pages
  • Creative agency branding and portfolios

Suggested color roles

primary

Use #FF0000 for high-impact calls-to-action, critical alerts, or dominant brand elements to convey urgency and passion.

secondary

Apply #0000FF or #8A2BE2 for supporting elements, subheadings, or to create a strong visual contrast.

accent

Integrate #FFD700 or #00FF00 for interactive states, small icons, or graphic details to add a burst of energy.

background

A deep charcoal or black background will make these vibrant colors truly pop. Alternatively, a clean white can offer stark contrast.

text

White text offers excellent contrast on #FF0000, #0000FF, and #8A2BE2. For lighter backgrounds, a dark gray or black is recommended for readability.

Accessibility notes

  • High contrast is critical for text. Many direct color pairings within this palette will fail WCAG AA for small text.
  • White or black text provides the most reliable contrast against the saturated primary and secondary colors.
  • Avoid using #00FF00 and #FFD700 together for small text due to potential issues for colorblind users and low luminance contrast.
  • Use neutrals (white, black, dark gray) as primary text/background colors to ensure accessibility for critical information.

Recommended combinations

Urban Impact

Excellent for bold headlines, striking call-to-action buttons, or dynamic graphic compositions.

#FF0000 · #0000FF · #FFD700

Graffiti Glow

Ideal for creating vibrant background patterns, playful illustrations, or energetic accent elements.

#8A2BE2 · #00FF00 · #FFD700

Dynamic Pop

Perfect for interactive elements, data visualization, or to highlight key features in a lively manner.

#0000FF · #FF0000 · #00FF00

CSS variables

:root {
  --vibrant-street-art-1: #FF0000;
  --vibrant-street-art-2: #FFD700;
  --vibrant-street-art-3: #00FF00;
  --vibrant-street-art-4: #0000FF;
  --vibrant-street-art-5: #8A2BE2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "vibrant-street-art": {
        1: "#FF0000",
        2: "#FFD700",
        3: "#00FF00",
        4: "#0000FF",
        5: "#8A2BE2",
      }
    }
  }
}

Related searches

vibrant primary color palettestreet art graffiti colorsbold urban design schemeenergetic branding palettehigh contrast UI colors

Palette colors

Hex values

Color 1#FF0000
·
Color 2#FFD700
·
Color 3#00FF00
·
Color 4#0000FF
·
Color 5#8A2BE2
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.9:1Fail
2.9:1Fail
2.1:1Fail
1.5:1Fail
2
2.9:1Fail
1:1Fail
6.1:1AA
4.2:1AA18
3
2.9:1Fail
1:1Fail
6.3:1AA
4.3:1AA18
4
2.1:1Fail
6.1:1AA
6.3:1AA
1.4:1Fail
5
1.5:1Fail
4.2:1AA18
4.3:1AA18
1.4:1Fail

Similar palettes

More like Vibrant Street Art

View all vibrant