Palette

Retro Sunset Drive

Bright and contrasting colors that evoke the vibrant energy of a 70s sunset drive with bold graphics.

vibrantretro5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Sunset Drive 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 Sunset Drive.

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

Data visualization

#E63946#F4A261#E9C46A#A7C5C5#264653

Palette guide

How to use Retro Sunset Drive

Overview

The Retro Sunset Drive palette offers bright, contrasting colors that evoke the vibrant energy of a 70s sunset drive with bold graphics, perfect for designers and developers aiming for a vintage yet dynamic feel. It features a fiery red (#E63946), a warm burnt orange (#F4A261), a golden yellow (#E9C46A), a soothing dusty teal (#A7C5C5), and a deep dark slate blue (#264653). This combination allows for powerful visual narratives, from striking digital interfaces to nostalgic print materials. Use #E63946 for impactful calls to action and #264653 as a sophisticated base to anchor your designs.

Best used for

Vintage travel posters and advertising
Retro automotive branding and marketing
70s-inspired apparel graphics
Album covers for indie or rock bands
Website designs with a warm, nostalgic feel
Editorial layouts for lifestyle magazines

Suggested color roles

primary

Use #E63946 as a bold, attention-grabbing core for key elements and calls to action.

secondary

Employ #F4A261 as a warm, inviting support, adding depth and a sun-kissed feel.

accent

Apply #E9C46A for a subtle, vintage glow, perfect for highlights or decorative details.

background

Utilize #264653 as a deep, sophisticated anchor, allowing the warmer tones to resonate powerfully.

text

Consider #A7C5C5 for lighter text on dark backgrounds, or a dark neutral like charcoal for general readability on lighter hues.

Accessibility notes

Ensure strong contrast when using #A7C5C5 as text against #264653 for optimal readability.
Avoid using #E9C46A for small text on #F4A261 backgrounds due to insufficient contrast.
For critical information, use a high-contrast pairing, such as black text on #E9C46A.
Always test all color combinations for readability, especially for users with color vision deficiencies.

Recommended combinations

Desert Dusk

A warm, glowing gradient for backgrounds or large graphic elements, evoking a sunset landscape.

#E63946 · #F4A261 · #E9C46A

Coastal Night

A dark, cool base with contrasting bright accents, ideal for UI elements or bold headers.

#264653 · #A7C5C5 · #E63946

Vintage Pop

A blend of muted warm and cool tones, suitable for illustrations, patterns, or subtle branding.

#F4A261 · #E9C46A · #A7C5C5

CSS variables

:root {
  --retro-sunset-drive-2-1: #E63946;
  --retro-sunset-drive-2-2: #F4A261;
  --retro-sunset-drive-2-3: #E9C46A;
  --retro-sunset-drive-2-4: #A7C5C5;
  --retro-sunset-drive-2-5: #264653;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-sunset-drive-2": {
        1: "#E63946",
        2: "#F4A261",
        3: "#E9C46A",
        4: "#A7C5C5",
        5: "#264653",
      }
    }
  }
}

Hex values

Color 1#E63946

Color 2#F4A261

Color 3#E9C46A

Color 4#A7C5C5

Color 5#264653

Accessibility

Contrast checker

2:1Fail

2.5:1Fail

2.3:1Fail

2.4:1Fail

2:1Fail

1.2:1Fail

1.1:1Fail

4.9:1AA

2.5:1Fail

1.2:1Fail

1.1:1Fail

6:1AA

2.3:1Fail

1.1:1Fail

5.5:1AA

2.4:1Fail

4.9:1AA

6:1AA

5.5:1AA

Similar palettes

More like Retro Sunset Drive

Retro Sunset Drive

See it in context.

Ready when you are.

Built with Retro Sunset Drive.

How to use Retro Sunset Drive

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Desert Dusk

Coastal Night

Vintage Pop

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Retro Sunset Drive