Back to palettes

Palette

Retro Soda Fountain

A playful blend of soft pinks and refreshing teals, reminiscent of a vintage diner's cheerful soda fountain.

pastelplayful5 colors
More pastel 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

#F7E5E3#E6C3B8#B0E6DD#7AD1CD#3EB0A8

Palette guide

How to use Retro Soda Fountain

Overview

The Retro Soda Fountain palette offers a playful and refreshing blend of soft pastels, perfect for designs aiming for a sweet, vintage charm. With light pinks like #F7E5E3 and #E6C3B8, paired with invigorating teals such as #B0E6DD, #7AD1CD, and the deeper #3EB0A8, this collection evokes the cheerful atmosphere of a classic diner. Designers can leverage its gentle contrast for inviting user interfaces, whimsical illustrations, or nostalgic branding. Developers will find these hex codes easy to implement for a consistent, harmonious aesthetic across various platforms.

Best used for

  • Vintage-themed branding and logos
  • Children's book illustrations or animations
  • Sweet shop or bakery website design
  • Retro-inspired app interfaces
  • Event invitations (baby showers, birthdays)
  • Packaging for confectionery products

Suggested color roles

primary

A refreshing teal, #7AD1CD, ideal for main buttons, hero sections, or key graphical elements, providing a cheerful anchor.

secondary

A warm, soft pink, #E6C3B8, excellent for complementary sections, secondary calls to action, or background accents, adding a touch of sweetness.

accent

A deeper, vibrant teal, #3EB0A8, perfect for small, impactful details like icons, hover states, or subtle dividers to draw attention.

background

A very light, almost white pink, #F7E5E3, suitable for clean, airy backgrounds that allow other colors to pop without overwhelming.

text

For optimal readability, use a dark charcoal like #333333 on light backgrounds like #F7E5E3, or a dark teal like #3EB0A8 for headings on lighter shades.

Accessibility notes

  • Ensure sufficient contrast between #F7E5E3 and #E6C3B8 when used for text or small elements, ideally avoiding this combination for critical information.
  • Text in #3EB0A8 on a light background like #F7E5E3 will likely meet WCAG AA contrast ratios for standard text.
  • Avoid using #B0E6DD as text on #7AD1CD; their proximity in value may cause readability issues for many users.
  • Always use a dark text color (e.g., black or dark grey) on all lighter pastel backgrounds for clear legibility and accessibility compliance.

Recommended combinations

Sweet & Fresh

Ideal for gentle branding, website headers, or social media graphics conveying a lighthearted and inviting mood.

#F7E5E3 · #E6C3B8 · #7AD1CD

Vibrant Teal Duo

Great for highlighting data, interactive elements, or creating a cohesive, refreshing visual flow in UI components.

#B0E6DD · #7AD1CD · #3EB0A8

Soft Contrast

Effective for calls-to-action against a light background, or for distinguishing content blocks in a clean layout.

#E6C3B8 · #3EB0A8 · #F7E5E3

CSS variables

:root {
  --retro-soda-fountain-3-1: #F7E5E3;
  --retro-soda-fountain-3-2: #E6C3B8;
  --retro-soda-fountain-3-3: #B0E6DD;
  --retro-soda-fountain-3-4: #7AD1CD;
  --retro-soda-fountain-3-5: #3EB0A8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "retro-soda-fountain-3": {
        1: "#F7E5E3",
        2: "#E6C3B8",
        3: "#B0E6DD",
        4: "#7AD1CD",
        5: "#3EB0A8",
      }
    }
  }
}

Related searches

retro pastel color schemevintage soda fountain colorssweet teal pink paletteplayful diner color codeslight retro design colors

Palette colors

Hex values

Color 1#F7E5E3
·
Color 2#E6C3B8
·
Color 3#B0E6DD
·
Color 4#7AD1CD
·
Color 5#3EB0A8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.1:1Fail
1.5:1Fail
2.2:1Fail
2
1.3:1Fail
1.2:1Fail
1.1:1Fail
1.6:1Fail
3
1.1:1Fail
1.2:1Fail
1.3:1Fail
1.9:1Fail
4
1.5:1Fail
1.1:1Fail
1.3:1Fail
1.5:1Fail
5
2.2:1Fail
1.6:1Fail
1.9:1Fail
1.5:1Fail

Similar palettes

More like Retro Soda Fountain

View all pastel
Diner Milkshake Dream
Retro Candy Swirl
Sweet Gumball Pop
Berry Blossom Kiss
Bubblegum Carnival Pop
Bubblegum Dream Cloud