Компоненты Индикатор выполнения Компонент индикатора выполнения

Компонент индикатора выполнения

Отзывчивый компонент полосы прогресса, разработанный для темного режима с использованием Tailwind CSS, подходит для современных веб-приложений.

Предварительный просмотр

HTML-код

<div class="flex items-center justify-center h-screen bg-gray-900 p-4">
    <div class="w-full max-w-md">
        <h2 class="text-white text-lg font-semibold mb-2">Upload Progress</h2>
        <div class="relative bg-gray-700 rounded-full h-4">
            <div class="bg-green-500 rounded-full h-full" style="width: 60%;"></div>
        </div>
        <div class="flex justify-between text-xs text-gray-400 mt-1">
            <span>0%</span>
            <span>60%</span>
            <span>100%</span>
        </div>
    </div>
</div>

Связанные компоненты

Индикатор прогресса Neumorphism

Компонент Progress Bar с дизайном Neumorphism, отзывчивыми эффектами и поддержкой темной темы с использованием Tailwind CSS

Открытый

Компонент индикатора выполнения

Отзывчивый компонент индикатора выполнения, разработанный с 3D-элементами, с использованием аналогичной цветовой схемы, подходящей для электронной коммерции, с поддержкой темного режима

Открытый

Компонент индикатора выполнения

Отзывчивый компонент индикатора выполнения, выполненный в стиле Material Design, включающий пастельные цветовые схемы для витрин портфолио. Он поддерживает темный режим.

Открытый