Atomic Modern
Teal, mustard and teak with starbursts and boomerangs: 1956 at its most optimistic.
This style
$9$19
One-time, no subscription · instant download · client use · 7-day refund before download
The idea
A warm paper canvas, teal and mustard shapes floating like boomerang coffee tables, and little atomic starbursts scattered between sections. A soft, wonky serif for headlines, a geometric sans for the rest, and flat illustration that could hang in a 1950s airline office.
Atomic Modern is built on 1950s American mid-century design: the optimism of the space age, boomerang and kidney shapes, atomic starbursts, flat airline-poster illustration and the teak and walnut of modernist furniture. A warm paper canvas carries teal, mustard and burnt-orange shapes that float like objects in a ranch-house living room. A soft, characterful serif with italic flourishes sets headlines; a clean geometric sans handles the rest. Starburst ornaments mark pauses. It should feel optimistic, crafted and sunny.
Principles
- Shapes are organic: boomerangs, kidneys and soft rounded rectangles.
- Teal leads, mustard supports, burnt orange is the spark.
- Scatter small starbursts between sections, never on top of text.
- Illustrate, don't photograph: flat mid-century scenes with grain.
- Italicise one word per headline for a hand-lettered feel.
Motion
Starburst ornaments rotate a slow 360° every 40 seconds like a wall clock. Sections float up 20px on scroll and cards lift 4px on hover with a warm shadow.
Do & don't
Do
- ✓ Use starbursts as section dividers.
- ✓ Give illustrations paper grain.
- ✓ Italicise one word in every headline.
Don't
- ✕ Don't use photography as the hero.
- ✕ Don't use neon or cool blues.
- ✕ Don't use sharp brutalist corners.
+ 3 more of each, and component rules, in the full DESIGN.md.
What's in the DESIGN.md
- 01Overview & principles
- 02Colors (tokens + proportions)
- 03Typography (families + 12-role scale)
- 04Layout & spacing scale
- 05Elevation & depth
- 06Shapes & radii
- 07Motion (easing, durations, signature)
- 08Imagery + generation prompt
- 09Components (button, card, nav, input, badge)
- 10Do's and don'ts
- 11Responsive behaviour
- 12Iteration guide + agent checklist
Plus theme.css (Tailwind v4 @theme), tokens.json (W3C) and the preview page source — 364 lines of DESIGN.md in total.
More like this
All Neo-Retro →Y2K Chrome
No. 038Liquid chrome, bubble shapes and frosted-blue gadgets from the year 2000.
Beige Desktop
No. 059Bevelled grey windows, navy title bars and a pixel font: the 90s desktop as a website.
Checker Diner
No. 060Cherry red, cream vinyl and a checkerboard floor: a roadside diner menu, open late.
Gilded Deco
No. 061Black lacquer, gold leaf and sunburst geometry from a 1920s grand hotel lobby.
Pixel Arcade
No. 0628-bit type, stepped pixel borders and coin-yellow buttons. Insert coin to continue.
Riso Overprint
No. 063Fluorescent pink and riso blue, overprinted slightly out of register on cream stock.