Spinner

Loading indicator component with multiple animation styles

案例展示

Spinner 在实际场景中的使用示例

按钮加载状态

页面加载

Loading page...

内容加载

Loading Data

Please wait...

不同尺寸

四种预设尺寸

sm

default

lg

xl

自定义颜色

通过 className 自定义边框颜色

Accent

Success

Warning

Destructive

Info

带文字

Spinner 与文字组合使用

Loading...

Please wait

Saving...

内联使用

在文本中内联使用

Syncing data

This may take a few seconds...

深色背景

在深色背景上使用

White

Accent

Success

不同形态

多种加载动画样式，满足不同场景需求

点状加载器

脉冲点

弹跳点

跳跃方块

墨迹溅射

条形加载器

音频条

铅笔绘制

圆环加载器

经典圆环

双圆环

手绘圆圈

描边圆环

方块加载器

旋转方块

场景应用

不同形态在实际场景中的应用示例

按钮加载状态（多形态）

卡片加载

Loading data...

Processing...

Syncing...

全屏加载样式

Zine Mark

Preparing amazing content for you...

列表项加载