Компонент индикатора выполнения
Простой компонент индикатора выполнения, стилизованный в брутальном стиле с цветовой схемой оттенков серого для приложений электронной коммерции. Он отзывчив и поддерживает темный режим.
HTML-код
<div class="w-full max-w-md mx-auto p-4">
<h2 class="text-white text-xl font-bold mb-2">Loading Your Items...</h2>
<div class="bg-gray-300 dark:bg-gray-700 rounded-full h-6">
<div class="bg-black dark:bg-white h-6 rounded-full" style="width: 70%;"></div>
</div>
<div class="flex justify-between mt-2">
<span class="text-gray-500 dark:text-gray-300 text-sm">0%</span>
<span class="text-gray-500 dark:text-gray-300 text-sm">70%</span>
</div>
</div>Связанные компоненты
Градиентный радужный индикатор выполнения для фотосъемки
Сложный, отзывчивый компонент индикатора выполнения для портфолио фотографий, отличающийся многоцветным градиентным радужным дизайном и поддержкой темного режима. Идеально подходит для демонстрации загрузки фотографий или продвижения по галерее.
Индикатор выполнения
Компонент индикатора выполнения с микровзаимодействиями. Включает в себя адаптивные эффекты и поддержку темной темы с использованием только HTML и CSS (Tailwind CSS).
Skeuomorphic_Monochromatic_Progress_Bar
Скевморфный компонент прогресс-бара средней сложности для электронной коммерции, отличающийся монохроматической цветовой схемой, полной ответственностью и поддержкой темного режима.