Composant Indicateurs de Progression Glassmorphism
Indicateur de progression Glassmorphism Composant avec palette de couleurs vives et complexité simple.
HTML Code
<div class="flex flex-col items-center justify-center min-h-screen dark:bg-gray-900">
<div class="dark:bg-gray-800 bg-white bg-opacity-20 dark:bg-opacity-20 backdrop-filter backdrop-blur-lg dark:backdrop-blur-lg rounded-lg p-6 shadow-xl dark:shadow-xl">
<h2 class="text-2xl font-bold text-gray-800 dark:text-white mb-4">Progress</h2>
<div class="w-64 h-4 bg-gray-300 rounded-full overflow-hidden dark:bg-gray-700">
<div class="h-full bg-gradient-to-r from-cyan-400 to-blue-500 dark:from-cyan-600 dark:to-blue-700 w-3/4 rounded-full"></div>
</div>
<p class="text-sm text-gray-700 dark:text-gray-300 mt-2">75% Complete</p>
</div>
</div>Composants associés
Volet Indicateurs de progrès
Un composant d’indicateurs de progression réactif avec un style glassmorphism, avec des éléments translucides givrés ressemblant à du verre et des effets de flou, prenant en charge le thème sombre à l’aide de Tailwind CSS.
Volet Indicateurs de progrès
Un composant d’indicateur de progression simple et réactif avec des effets néon/lumineux et des tons de bijoux, adapté aux sites de conseil/de services. Inclut la prise en charge du mode sombre.
Memphis_Gaming_Progress_Indicators
Un composant d’indicateurs de progression complexe et réactif pour les jeux, inspiré du design de Memphis avec une palette de couleurs de coucher de soleil. Comprend plusieurs barres de progression, un affichage de niveau et des éléments interactifs, avec prise en charge du mode sombre.