Back to palettes

Palette

Retro Surf Pop

Lively and dynamic colors evoking Californian surf culture and retro advertising.

vibrantplayful5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Surf 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 Retro Surf Pop.

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

Data visualization

#FFD700#00BFFF#FF4500#ADFF2F#8A2BE2

Palette guide

How to use Retro Surf Pop

Overview

The Retro Surf Pop palette offers lively and dynamic colors that evoke Californian surf culture and retro advertising, ideal for designers and developers aiming for a playful, energetic vibe. It features a bright gold (#FFD700), a deep sky blue (#00BFFF), a fiery orange-red (#FF4500), a vibrant green-yellow (#ADFF2F), and a bold blue-violet (#8A2BE2). This selection is perfect for creating designs that are fresh, bold, and full of character. Use #00BFFF as a cool, vibrant base and #FF4500 for attention-grabbing pops to capture the essence of sun-drenched beaches and endless summer.

Best used for

  • Summer fashion and swimwear branding
  • Surf shop websites or social media content
  • Retro-themed event graphics and promotions
  • Children's book illustrations and educational materials
  • Music festival branding and merchandise
  • Packaging for playful and vibrant products

Suggested color roles

primary

Use #00BFFF as a vibrant, cool base, effectively evoking the ocean and sky for dominant elements.

secondary

Employ #FFD700 as a sunny, energetic contrast, like beach sand or a bright sun, for supporting roles.

accent

Apply #FF4500 as a bold, hot pop, perfect for attention-grabbing details or calls to action.

background

Utilize #ADFF2F as a fresh, lively backdrop, creating a playful canvas for other bright elements.

text

Consider #8A2BE2 for distinctive headlines on light backgrounds, or black/charcoal for general readability on light hues.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using #FFD700 on #ADFF2F, to maintain readability.
  • #00BFFF and #8A2BE2 provide good contrast for text on #FFD700 or #ADFF2F backgrounds.
  • Avoid using #ADFF2F for small text on #FFD700 due to potential readability issues for some users.
  • For critical information, always pair a dark neutral (like black) with the lightest colors for maximum readability.

Recommended combinations

Beach Day

A bright, airy combination for playful backgrounds, web headers, or cheerful illustrations.

#FFD700 · #00BFFF · #ADFF2F

Surf's Up

Cool blue with fiery orange and purple pop, ideal for dynamic logos, icons, or energetic branding.

#00BFFF · #FF4500 · #8A2BE2

Pop Art

Lively green-yellow with warm accents, suitable for bold illustrations, patterns, or expressive graphics.

#ADFF2F · #FFD700 · #FF4500

CSS variables

:root {
  --retro-surf-pop-1: #FFD700;
  --retro-surf-pop-2: #00BFFF;
  --retro-surf-pop-3: #FF4500;
  --retro-surf-pop-4: #ADFF2F;
  --retro-surf-pop-5: #8A2BE2;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-surf-pop": {
        1: "#FFD700",
        2: "#00BFFF",
        3: "#FF4500",
        4: "#ADFF2F",
        5: "#8A2BE2",
      }
    }
  }
}

Related searches

retro surf colorspop art color palettevibrant beach aestheticenergetic summer palettecalifornian retro design

Palette colors

Hex values

Color 1#FFD700
·
Color 2#00BFFF
·
Color 3#FF4500
·
Color 4#ADFF2F
·
Color 5#8A2BE2
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.5:1Fail
1.1:1Fail
4.2:1AA18
2
1.5:1Fail
1.6:1Fail
1.7:1Fail
2.8:1Fail
3
2.5:1Fail
1.6:1Fail
2.8:1Fail
1.7:1Fail
4
1.1:1Fail
1.7:1Fail
2.8:1Fail
4.9:1AA
5
4.2:1AA18
2.8:1Fail
1.7:1Fail
4.9:1AA

Similar palettes

More like Retro Surf Pop

View all vibrant
Retro Pop Fizz
Atomic Diner Swirl
Bubblegum Pop Burst
Candy Wrapper Pop
Diner Jukebox Gleam
Fiesta Pop Celebration