forever components

Memphis 80s

Confetti Pop

Memphis geometric shapes burst upward with gravity and rotation in repeating pops on deep plum. Dots, zigzags, triangles, bars, and pluses auto-cycle.

canvasmedium complexityintense motion

Open on the canvas to copy the code → Free account · 3 copies a day · membership goes unlimited

Live demo — the real component, running in a sandbox. One self-contained HTML file, zero dependencies. Open it on the canvas →
Worth keeping? Votes steer what gets built next — sign in to cast one, free to read

When to use it

Celebration screens, launch announcements, festive hero backgrounds with an 80s geometric aesthetic.

When not to

Contexts needing legible overlaid text or calm motion — bursts are frequent and high-energy. Low-end mobile with limited CPU.

Working with an AI agent

Every component ships agent-ready metadata. An example instruction for this one:

Replace COL with ["#ff2d78","#00c9ff","#ffe600","#ff6b00","#ffffff"] and set nextBurst = ts + 280 + rnd()*200 to tighten burst frequency. Theme: dark tokens live in :root, the light variant in :root[data-theme="light"]; ?theme=light or a {type:'forever:theme'} postMessage switches at runtime.

Safe to edit

  • burst interval (520 + rnd()*340 ms)
  • particle pool size (N=104)
  • shape size range (6 + rnd()*14)
  • color palette (COL array)
  • gravity (vy += 0.045)
  • lifetime (70 + rnd()*70 frames)
  • theme tokens (:root dark defaults + [data-theme=light] overrides)

Keep intact

  • IIFE wrapper
  • prefers-reduced-motion static frame fallback
  • visibilitychange pause/resume
  • DPR-aware canvas sizing
  • theme hook (?theme= bootstrap + forever:theme message listener + theme tokens)

Known limitations

  • Fixed pool of 104 particles — heavy overlap recycles live particles early causing flicker
  • Background hardcoded in both CSS and JS clearBg(); change both to retheme
  • No touch/click interaction — purely passive

confettiparticlesmemphisgeometricburstcanvasloop

More Memphis 80s components

  • Squiggle ParadeSix bold sine-wave ribbons with marching color beads drift across a confetti field of dots, zigzags, crosses, and terrazzo flecks on deep indigo.
  • Terrazzo Scatter96 colored terrazzo chips breathe apart from a tilted slab card and resettle in a 5.2s looping cycle, using a Memphis 80s palette on dark umber.
  • Zigzag Bounce7 stacked chevron bars in clashing Memphis colors spring upward with a staggered ripple phase; confetti speckles and squiggle accents frame the scene.
  • Polka ShuffleBrick-offset grid of dots, rings, and squares sways and breathes while colors cross-fade between three clashing Memphis 80s palettes on dark charcoal.
  • Grid Jumble5x5 grid of Memphis shapes — circles, triangles, squiggles, zigzags — jittering in sine-wave phases over a terrazzo-speckled dark background.
  • Noodle LoopFive thick snaking SVG noodles in Memphis colors travel via stroke-dashoffset on a dark violet field; corner dots pulse and confetti spins.