Progress Bar V08
Template Details
Author: Colorlib
Released: September 2026
License: CC BY 3.0
Description
An upload panel with a drop zone and a list of files, each with a type badge, its own progress bar, bytes transferred and time left. Files can be uploading, done or failed, with cancel, retry and remove buttons, and a Simulate upload button adds three files, one of which fails. Choosing real files through the browse link runs the same simulated upload.
It is plain HTML and CSS plus a few lines of vanilla JavaScript: no jQuery, no Bootstrap files, no plugins, and the download is 202 KB. Use it on its own, or drop it into a Bootstrap 4, 5 or 6 project and it looks the same.
- Uploading, done and failed states with colour and text, not colour alone
- Per-file progressbar with aria-valuetext for done and failed
- Cancel, retry and remove buttons with file-specific labels and managed focus
- Polite live region announces finished and failed uploads
- Long file names truncate cleanly on phones
Similar Templates
