# Retro-futurism

Also called: retrofuturism, atomic age design, space age UI, 1950s future, Jetsons style, mid-century futurism  
Era: 1950s-1960s (atomic age, space race); web usage 2018 onward (brands wanting optimism with nostalgia)  
Page: https://designforai.dev/style/retro-futurism

## Traits

- boomerang and starburst shapes, orbit rings, atoms, rockets, ray guns
- mid-century palette: turquoise, tangerine, mustard, cherry red on cream or charcoal
- rounded rectangles with a chrome or two-tone treatment; TV-screen curves
- script display fonts (Googie signage) mixed with wide geometric sans in caps
- halftone dots, off-register print, aged paper textures
- illustration in the style of 1950s advertising: confident, smiling, optimistic
- motion: orbiting elements, blinking bulb signs, gentle rotation

Palette: #f4e9d8 cream, #2b2b2b charcoal, #3fb8af turquoise, #f37021 tangerine, #e4b429 mustard, #c8102e cherry

Type: Monoton or Pacifico for one script headline, Righteous or Bungee for display caps, Josefin Sans or Futura-alike Jost for body at 16-17px; display 48-96px

## Do

- build a starburst SVG (12-16 thin spikes) and an atom orbit SVG and use them as section markers
- use TV-screen shapes: border-radius 24px 24px 24px 24px / 40px for cards, slightly bulged
- combine one script font with one wide caps font; the pairing is the style

## Don't

- do not use neon; that is cyberpunk. Retro-futurism is daylight and print
- do not use chrome gradients everywhere; one or two chrome accents max
- do not use modern flat icons; draw them as 1950s pictograms with rounded ends

Known for it: Fallout (Vault-Tec), Disney Tomorrowland, Googie diners, Space Needle imagery, Tiki bars

## CSS seed

```css
:root{--bg:#f4e9d8; --fg:#2b2b2b; --accent:#3fb8af; --accent2:#f37021; --accent3:#e4b429; --accent4:#c8102e; --radius:24px 24px 24px 24px / 40px 40px 40px 40px; --font:'Jost',sans-serif; --font-display:'Righteous',sans-serif}
```

## Prompt

Build the site in retro-futurist atomic age style. Background cream #f4e9d8 with an aged paper texture (SVG noise at opacity 0.08, multiply), text #2b2b2b, palette turquoise #3fb8af, tangerine #f37021, mustard #e4b429, cherry #c8102e. Fonts: Pacifico for one script word in the hero at 72px in #c8102e, Righteous uppercase for headings at 56/36/24px with 0.04em tracking, Jost 400 at 17px for body. Decorate with inline SVGs: a 16-spike starburst in #e4b429 behind the hero title, an atom with three orbit rings rotating slowly (20s linear) in the corner, boomerang shapes in turquoise as section dividers. Cards use a TV-screen shape (border-radius 24px / 40px), 3px #2b2b2b outline and a two-tone header band. Buttons: pill, #f37021 fill, cream text in Righteous, 3px #2b2b2b outline, hard offset shadow 4px 4px 0 #2b2b2b. Halftone dot pattern (radial-gradient 3px) over hero imagery. Motion: orbit rotation, a 1.2s blinking bulb effect on one sign; nothing else.
