Progress Bar
A responsive progress bar component with dark mode support for e-commerce, featuring a vibrant color scheme and a simple layout.
HTML Code
<div class="w-full bg-gray-200 dark:bg-gray-700 rounded-full h-4 relative overflow-hidden">
<div class="bg-indigo-600 h-4 rounded-full dark:bg-indigo-400" style="width: 75%;">
<span class="absolute right-2 top-0 h-full flex items-center text-white text-xs font-bold">75%</span>
</div>
</div>
Related Components
Skeuomorphic Progress Bar
Skeuomorphic progress bar component for portfolios, featuring a monochromatic color scheme and complex, interactive design with responsive and dark mode support using Tailwind CSS.
Neumorphic Progress Bar
A responsive progress bar component designed with Neumorphism style, supporting both light and dark themes using Tailwind CSS.
Glassmorphism Progress Bar
Glassmorphism-style progress bar designed for social media interfaces, featuring vibrant colors and dark mode support. Simple layout with no JavaScript.