Back to palettes

Palette

California Dream Wave

Captures the sun-drenched, carefree vibe of California beaches and retro surf culture, energetic and bright.

vibrantenergetic5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how California Dream Wave 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 California Dream Wave.

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

Data visualization

#00CED1#F4A460#FFD700#4682B4#FFF8DC

Palette guide

How to use California Dream Wave

Overview

The California Dream Wave palette captures the sun-drenched, carefree vibe of California beaches and retro surf culture, energetic and bright. This vibrant collection features a refreshing turquoise, #00CED1, and a deep, oceanic blue, #4682B4, evoking the Pacific Ocean. These are brilliantly contrasted with a warm, sandy orange, #F4A460, and a radiant gold, #FFD700, reminiscent of sunsets and golden beaches. A very light, almost off-white hue, #FFF8DC, provides a clean backdrop. Designers will find this palette excellent for creating dynamic, playful, and nostalgic visuals. Developers can leverage these colors to build lively and engaging user interfaces for brands focused on travel, summer fashion, entertainment, or any application seeking a cheerful and distinct personality.

Best used for

  • Retro surf and beachwear brands
  • Travel and tourism promotions
  • Summer event marketing
  • Youth-focused digital media
  • Vibrant illustration and animation
  • Recreational sports websites

Suggested color roles

primary

Utilize #FFF8DC as a clean, bright primary background, providing an airy and versatile canvas.

secondary

Apply #4682B4 for secondary elements, offering a stable, oceanic blue that complements the primary.

accent

Introduce #FFD700 or #F4A460 as powerful, high-impact accents for calls to action, headlines, or key visual elements, adding a sunny pop.

background

Employ #FFF8DC for light, inviting backgrounds, allowing the bolder colors to truly stand out.

text

Use #4682B4 for main body text and headings, ensuring strong readability and a cool, stable feel. Black also works well for contrast.

Accessibility notes

  • Ensure high contrast when pairing #4682B4 or black text with #FFF8DC or #F4A460 backgrounds for optimal readability.
  • The bright #FFD700 and #F4A460 should be used with caution for text; ensure they have enough contrast against their background.
  • Avoid using #00CED1 for small text on #FFF8DC as the contrast may be insufficient for WCAG AA compliance.
  • For interactive elements, use #4682B4 or #00CED1 to ensure clear affordance and meet WCAG contrast guidelines.

Recommended combinations

Sunset Wave

Creates a dynamic contrast with warm orange and cool turquoise against a light background, ideal for hero sections or headers.

#F4A460 · #00CED1 · #FFF8DC

Golden Beach

Offers a vibrant yet grounded feel, blending sunny gold with oceanic blue and a clean background, suitable for content blocks.

#FFD700 · #4682B4 · #FFF8DC

Surf Pop

Combines bright turquoise with orange and deep blue for an energetic and playful visual, excellent for accents or graphics.

#00CED1 · #F4A460 · #4682B4

CSS variables

:root {
  --california-dream-wave-1: #00CED1;
  --california-dream-wave-2: #F4A460;
  --california-dream-wave-3: #FFD700;
  --california-dream-wave-4: #4682B4;
  --california-dream-wave-5: #FFF8DC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "california-dream-wave": {
        1: "#00CED1",
        2: "#F4A460",
        3: "#FFD700",
        4: "#4682B4",
        5: "#FFF8DC",
      }
    }
  }
}

Related searches

california beach color paletteretro surf colorsvibrant summer schemeocean orange yellow paletteenergetic coastal design

Palette colors

Hex values

Color 1#00CED1
·
Color 2#F4A460
·
Color 3#FFD700
·
Color 4#4682B4
·
Color 5#FFF8DC
·

Accessibility

Contrast checker

1
2
3
4
5
1
1:1Fail
1.4:1Fail
2.1:1Fail
1.8:1Fail
2
1:1Fail
1.4:1Fail
2:1Fail
1.9:1Fail
3
1.4:1Fail
1.4:1Fail
2.9:1Fail
1.3:1Fail
4
2.1:1Fail
2:1Fail
2.9:1Fail
3.9:1AA18
5
1.8:1Fail
1.9:1Fail
1.3:1Fail
3.9:1AA18

Similar palettes

More like California Dream Wave

View all vibrant