组件 装载 机 暗黑模式加载器

暗黑模式加载器

用于深色模式界面的加载器或骨架组件,具有响应功能。无需 JavaScript。

预览

HTML 代码

<div class="flex flex-col gap-4 w-full">
  <div class="flex items-center justify-between">
    <div>
      <div class="h-2 w-24 bg-gray-500 rounded"></div>
      <div class="h-2 w-16 bg-gray-500 mt-2 rounded"></div>
    </div>
    <div class="h-10 w-10 bg-gray-500 rounded-full"></div>
  </div>
  <div class="space-y-2">
    <div class="h-2 w-full bg-gray-500 rounded"></div>
    <div class="h-2 w-full bg-gray-500 rounded"></div>
    <div class="h-2 w-full bg-gray-500 rounded"></div>
    <div class="h-2 w-1/2 bg-gray-500 rounded"></div>
  </div>
</div>

相关组件

Loaders 组件

以粗野主义风格设计的 Loaders 组件,侧重于商业/公司网站的交互性,具有类似的配色方案和响应式设计,并支持深色模式。该设计展示了不同的加载器动画,这些动画捕捉了粗野主义的大胆和原始美学。

打开

加载器组件

一个3D设计的加载器组件,展示具有深度和参与感的加载动画,具有响应效果和深色主题支持,使用Tailwind CSS。

打开

加载器组件

一个 Material Design 样式的 Loaders 组件,具有响应式设计,用于展示工作或产品,具有深色主题并使用 Tailwind CSS。

打开