Neumorpher Fortschrittsbalken
Eine reaktionsschnelle Fortschrittsleisten-Komponente, die im Neumorphism-Stil entwickelt wurde und sowohl helle als auch dunkle Designs mit Tailwind CSS unterstützt.
HTML-Code
<div class="flex flex-col items-center justify-center min-h-screen bg-gray-100 dark:bg-gray-800 p-4">
<div class="w-64 bg-gray-200 dark:bg-gray-900 rounded-full shadow-lg p-1">
<div class="bg-gradient-to-r from-blue-500 to-blue-700 h-4 rounded-full" style="width: 70%;"></div>
</div>
<span class="mt-2 text-gray-700 dark:text-gray-300">70%</span>
</div>
Verwandte Komponenten
Triadischer Fortschrittsbalken für den Dunkelmodus
Eine einfache und dreifarbige Fortschrittsbalkenkomponente für den Dunkelmodus, die für Blogs und den Konsum von Inhalten geeignet ist. Es verfügt über ein responsives Design mit Tailwind CSS, das das Präfix dark: für die Unterstützung dunkler Themen ohne JavaScript verwendet.
Fortschrittsbalken für E-Commerce-Bestellungen
Eine reaktionsschnelle Fortschrittsbalkenkomponente für den E-Commerce mit Unterstützung des Dunkelmodus und einem monochromen Design. Kein JavaScript, nur HTML und Tailwind CSS.
Komponente der Fortschrittsleiste
Eine reaktionsschnelle Fortschrittsbalken-Komponente, die mit 3D-Elementen entworfen wurde, unter Verwendung eines analogen Farbschemas, das für den E-Commerce geeignet ist, mit Unterstützung für den Dunkelmodus