Bead
A download button whose outline is the progress bar
A download button that turns into a round progress circle. Good for: download links for apps, files, PDFs or music. How it works: the button shrinks to a circle that fills with liquid while a small bead runs around its edge, then opens up again when the download ends. How to use: copy the files into your page and point it at your own file. No libraries needed.
$4.20 — one-time price, free updates
- A UI component for any site
- Plain HTML, CSS and JavaScript · nothing to install
- Use it in unlimited client projects
Built with Plain JavaScript, CSS, SVG.
What is in the zip
- README.md
- app.css
- app.js
- index.html
Version history
- v1.0.0, 2026-09-09 — First release. Bead shipped as one file, with the reel recorded from the real page.