Stats with Circular Progress Rings
Dark stats section with four SVG circular progress rings that fill and count up to their percentage when scrolled into view.
Tag: progress
Components tagged with "progress".
14 components
Vertical Stepper with Descriptions
Dark Tailwind CSS vertical stepper with completed, current and upcoming states, step descriptions, a progress bar and Back / Mark as complete controls.
Upload Progress List
Dark Tailwind CSS upload list with per-file progress bars, speed and time left, pause, resume, retry and remove actions, a queue and total progress.
Toast with Progress Bar
Stacked toast notifications with a CSS countdown progress bar that pauses on hover or focus and closes the toast when it runs out.
Back to Top Button with Scroll Progress
Round back-to-top button with an SVG ring that fills as you scroll, a percentage label and smooth scrolling, for the page or any scroll container.
Circular Progress Indicator
SVG ring progress indicators with an animated fill, count-up percentage, glow colors and a slider-driven demo ring with color thresholds.
Animated Progress Bars
Bootstrap 5 dark dashboard with labelled bars that fill on scroll, a striped animated build progress bar and a stacked storage bar.
KPI Cards with Progress
Dark Bootstrap 5 KPI cards with trend badges, goal progress bars and a Month, Quarter and Year switch for admin and sales dashboards.
Multi-Step Registration Form
Bootstrap 5 three-step registration form with a progress bar, step indicators, per-step validation, password matching, plan cards and a success screen.
Full-Page Loader
Tailwind CSS full-page loader overlay with a spinning gradient ring, progress bar and status messages that fades out once the page has loaded.
Onboarding Wizard
Tailwind CSS onboarding wizard with step indicator, progress bar, radio cards, topic chips, validation and an editable summary before finishing.
Rating Summary with Bars
Tailwind CSS review summary with an average score, partial star fill and clickable rating distribution bars that filter reviews.
File Upload Dropzone
Tailwind CSS drag-and-drop file upload zone with keyboard support, type and size validation, a file list and per-file progress bars.
Horizontal Progress Stepper
Tailwind CSS horizontal stepper with numbered circles, animated connector lines, completed/current/upcoming states and Back/Continue controls.