3D进度条组件

具有3D效果、Tailwind CSS、响应式设计和暗黑模式支持的样式。

预览

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>

相关组件

进度指示器组件

专为运动/健身应用而设计的豪华/高级风格进度指示器组件，具有宝石色调、精致的排版和完全响应能力，并支持深色模式。

打开

进度指示器组件

受纸张/印刷品启发的市场进度指示器，具有糖果/甜蜜的颜色。具有多个步骤、响应式布局和深色模式支持的复杂设计。

打开

赛博朋克农业进度指示器

一组未来主义的赛博朋克主题进度指示器，适用于农业或农业网站，具有温暖的日落色调。响应式，支持深色模式。

打开