Componente de barra de progreso 3D
Diseñado con efectos 3D, Tailwind CSS, diseño responsivo y compatibilidad con modo oscuro.
Código HTML
<div class='relative pt-1 dark:bg-gray-800'>
<div class='overflow-hidden h-2 text-xs flex rounded bg-gray-200 dark:bg-gray-700'>
<div style='width: 45%' class='shadow-none flex flex-col text-center whitespace-nowrap text-white justify-center bg-blue-500 dark:bg-blue-400'></div>
</div>
<div class='mt-2 text-right text-xs dark:text-gray-400'>45% Complete</div>
</div>Componentes relacionados
BrutalistaEscala de grisesBarra de progreso
Una barra de progreso en escala de grises de estilo brutalista para el contenido del blog, con un diseño simple, compatibilidad con el modo oscuro y capacidad de respuesta.
Componente de Indicadores de Progreso
Un componente de indicadores de progreso receptivo con estilo de cristal, con elementos translúcidos similares al vidrio esmerilado y efectos de desenfoque, que admite el tema oscuro con Tailwind CSS.
Componente de Indicadores de Progreso
Un componente de indicadores de progreso de estilo retro / vintage que usa Tailwind CSS con efectos responsivos y soporte para temas oscuros.