Back to palettes

Palette

Retro Soda Fountain

A vibrant and playful collection, reminiscent of the colorful syrups and cheerful atmosphere of an old soda fountain.

vibrantretro5 colors
More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Retro Soda Fountain 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 Soda Fountain.

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

Data visualization

#8B0000#0000FF#FFFF00#008000#FF69B4

Palette guide

How to use Retro Soda Fountain

Overview

The Retro Soda Fountain palette is a burst of vibrant, primary-inspired colors, capturing the lively essence of a vintage diner. Featuring bold #8B0000 (Dark Red), bright #0000FF (Blue), cheerful #FFFF00 (Yellow), classic #008000 (Green), and playful #FF69B4 (Hot Pink), this collection is perfect for projects demanding high energy and a distinct retro appeal. Designers can use these hues to create impactful branding, dynamic illustrations, or energetic digital interfaces, while developers will appreciate the clear differentiation for component styling and visual hierarchy.

Best used for

  • High-energy retro branding
  • Children's toy packaging or websites
  • Arcade game interfaces
  • Event posters and flyers (retro theme)
  • Pop art style illustrations
  • Casual dining restaurant branding

Suggested color roles

primary

A strong Dark Red, #8B0000, perfect for main headings, call-to-action buttons, or elements requiring immediate attention.

secondary

A vibrant Blue, #0000FF, excellent for secondary navigation, important links, or graphical elements that need to stand out.

accent

A cheerful Yellow, #FFFF00, ideal for highlights, notifications, or small decorative details to add a pop of brightness.

background

While not explicitly a background color, #FFFF00 can be used as a vibrant background for sections, demanding careful text contrast. For general backgrounds, consider a neutral light grey or off-white.

text

Use a deep, contrasting color like #8B0000 or a standard black (#000000) for text on lighter shades like #FFFF00. For text on #0000FF or #8B0000, white (#FFFFFF) is essential.

Accessibility notes

  • Contrast between #FFFF00 and #0000FF, #8B0000, or #008000 is generally good for large text and graphics, but ensure sufficient contrast for small text.
  • Avoid using #FFFF00 as a text color on light backgrounds; it will fail accessibility standards due to poor contrast.
  • White text (#FFFFFF) is recommended for legibility on #8B0000, #0000FF, and #008000 to meet WCAG AA guidelines.
  • Be mindful of color-blind users; the combination of #008000 (Green) and #8B0000 (Red) might be problematic without additional visual cues.

Recommended combinations

Primary Pop

Excellent for bold branding, dynamic headers, or creating a high-impact, energetic visual presence.

#8B0000 · #0000FF · #FFFF00

Candy Shop

Perfect for playful designs, children's products, or adding a whimsical, sweet touch to illustrations.

#FF69B4 · #FFFF00 · #008000

Retro Contrast

Ideal for creating strong visual separation, interactive elements, or a striking, memorable visual identity.

#0000FF · #8B0000 · #FFFF00

CSS variables

:root {
  --retro-soda-fountain-4-1: #8B0000;
  --retro-soda-fountain-4-2: #0000FF;
  --retro-soda-fountain-4-3: #FFFF00;
  --retro-soda-fountain-4-4: #008000;
  --retro-soda-fountain-4-5: #FF69B4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-soda-fountain-4": {
        1: "#8B0000",
        2: "#0000FF",
        3: "#FFFF00",
        4: "#008000",
        5: "#FF69B4",
      }
    }
  }
}

Related searches

vibrant retro color paletteprimary colors diner themebold 50s color schemeplayful vintage color codeshigh contrast retro colors

Palette colors

Hex values

Color 1#8B0000
·
Color 2#0000FF
·
Color 3#FFFF00
·
Color 4#008000
·
Color 5#FF69B4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
9.3:1AAA
1.9:1Fail
3.8:1AA18
2
1.2:1Fail
8:1AAA
1.7:1Fail
3.2:1AA18
3
9.3:1AAA
8:1AAA
4.8:1AA
2.5:1Fail
4
1.9:1Fail
1.7:1Fail
4.8:1AA
1.9:1Fail
5
3.8:1AA18
3.2:1AA18
2.5:1Fail
1.9:1Fail

Similar palettes

More like Retro Soda Fountain

View all vibrant