加载动画 · Massive Robin

类型：组件　·　分类：加载动画　·　收录：2026-09-19　·　源码：会员可见

[hidecontent type="vip1"]

<!-- From Uiverse.io by Amerss  - Tags: loader, smooth, code, colorful -->
<div
  class="mx-auto w-[500px] bg-gray-950 rounded-xl overflow-hidden drop-shadow-xl"
>
  <div class="bg-[#333] flex items-center p-[5px] text-whitec relative">
    <div class="flex absolute left-3">
      <span class="h-3.5 w-3.5 bg-[#ff605c] rounded-xl mr-2"></span>
      <span class="h-3.5 w-3.5 bg-[#ffbd44] rounded-xl mr-2"></span>
      <span class="h-3.5 w-3.5 bg-[#00ca4e] rounded-xl"></span>
    </div>
    <div class="flex-1 text-center text-white">status</div>
  </div>
  <div class="p-2.5 text-[#0f0]">
    <div>
      <span class="mr-2">Loading</span>
      <span class="animate-[ping_1.5s_0.5s_ease-in-out_infinite]">.</span>
      <span class="animate-[ping_1.5s_0.7s_ease-in-out_infinite]">.</span>
      <span class="animate-[ping_1.5s_0.9s_ease-in-out_infinite]">.</span>
    </div>
  </div>
</div>


    

[/hidecontent]