forever components

Organic & Nature

Lightning Bolt

Jagged lightning bolts with branching forks strike randomly down a dark storm-sky canvas; screen flashes rust-white on each strike. Tap to trigger instantly.

canvasmedium complexityintense motionclick

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

Dark-themed hero backgrounds, storm or energy themes, dramatic loading screens or idle screensavers.

When not to

Light-background UIs (sky hardcoded dark navy). Contexts where sudden bright flashes are a photosensitivity concern.

Working with an AI agent

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

Change bolt color to gold by replacing '#AE6147' with '#ffaa00' and '#f5efe6' with '#fff0a0', and increase branch probability from 0.35 to 0.55.

Safe to edit

  • bolt color (path calls: '#AE6147', '#f5efe6', '#ffffff')
  • branch probability (Math.random()<0.35)
  • auto-strike interval (40+Math.random()*120)
  • bolt jaggedness (W*0.16 spread)
  • flash intensity (flash*0.28)
  • bolt segment count (steps=14)

Keep intact

  • visibilitychange pause/resume
  • prefers-reduced-motion guard
  • DPR-aware canvas sizing
  • globalCompositeOperation='lighter' for glow effect

Known limitations

  • Rapid flashing on strike could be a photosensitivity risk — no opt-out beyond reduced-motion slowing the fade
  • Background color hardcoded in CSS; must edit to change from dark navy
  • Single bolt at a time — no simultaneous multi-bolt support

lightningcanvasstormgenerativebranchesflashnature

More Organic & Nature components

  • Growing VineA sinuous green vine grows upward sprouting 14 alternating leaves and a pale bud tip, then retracts in a seamless loop on a dark forest background.
  • Flickering FireAdditive-blended ember particles rise from a glowing orange base, flickering like a real flame; cursor pans left/right to fan the fire sideways.
  • Water RippleConcentric ripple rings expand across a deep teal water surface with shimmering caustic bands; tap anywhere to drop a new ripple. Auto-drops periodically.
  • Falling SnowUp to 110 depth-layered snowflakes drift and sway down a dark blue gradient; pointer movement shifts a wind force that nudges the entire flurry sideways.
  • Drifting CloudsPuffy white clouds with radial-gradient puffs and soft blue undersides drift across a layered sky gradient; pointer nudges them forward.
  • Aurora RibbonsThree glowing aurora bands in green and violet ripple and sway over a twinkling starfield; pointer steers the horizontal drift of all ribbons.