arc charge
freeThe prompt is free with an account: sign up with Google or email, and your copy starts right after. The project and Figma file come with monthly or yearly.
A charging screen that fills the whole window, made of one WebGL2 shader and one big number. At rest a dim 4 % sits over a faint red thread between two contacts and a 24-tick level scale. A spark flares on the left contact, the camera pushes in and chases it along the thread as it ignites into an arc, with dust streaking past; it hits the right contact in a flash and the camera pulls back to the wide shot. Then the number counts up and the arc changes with the level: a thin amber filament at low charge, a jittering blue arc with side filaments peeling off in the middle, a wild violet-white arc throwing sparks near full. At 100 % it straightens into a calm mint-white beam with an anamorphic flare, the ticks fill in the same colour, and the level drains back to 4 % to loop. It plays as an 8-second seamless loop at any window size and keeps the scene centred on the shorter side. The colours by level, every timing and the arc's shape are a few named constants. Every frame is a pure function of time, with window.__render(t) and a ?rec mode for frame-exact video export; reduced motion shows one still of the full beam. The font is local, so it runs offline.
what you get
- prompt
- Paste it into Claude, Codex, Kimi or Cursor to rebuild this template. Tested: we rebuild every template from its prompt before it goes live.
- project
- The Vite + React source code as a .zip, ready to run.
- figma file
- The editable design as a .fig file to import into Figma.
what's inside
- charging screen
- progress indicator
- electric arc
- webgl shader
- camera move
- sparks
- level ticks
- autoplay loop
- frame-exact recorder
stack
- react
- vite
- typescript
- webgl2
fonts
Geist
Free fonts, linked in the prompt.
colors
- #020203
- #E6290D
- #FF7A0F
- #294DFF
- #7F3DFF
- #1ABF99
- #BFFFEB
- #FFFFFF
license
Free account: personal use only. Monthly or yearly adds commercial and client work. Don't resell or share the template, prompt or files.
read the license

