CCHub Tailwind Collection

组件进度指示器 3D进度条组件

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>

相关组件

进度指示器组件

这是一个使用 Tailwind CSS 样式化的材料设计进度指示器组件，具有响应式效果和暗黑主题支持.

打开

玻璃化进度指示器组件

玻璃态进度指示器组件，具有鲜艳的色彩方案和简单的复杂度。

打开

BrutalistGrayscaleProgressBar （粗野灰度进度条）

用于博客内容的野兽派风格的灰度进度条，具有简单的设计、深色模式支持和响应能力。

打开