SVG 指示器（CSS 和 SMIL）

所有指示器都显示在一个24 x 24 dp的视图框内。主要内容位于22 dp的活动区域中，周围有1 dp的内边距。

需考虑的几点：

1. SMIL 动画（无论是内联还是通过img标签引用）会在页面完全加载后开始播放，而CSS动画则在页面加载时开始播放。
2. 在基于webkit的浏览器中，通过img标签引用的SMIL和CSS动画在缩放比例不是100%时会出现不寻常的行为。而内联使用它们似乎在各浏览器间表现正常且一致。

预览

环形加载动画

预览图	CSS 大小（字节）	SMIL 大小（字节）
/	CSS (428)	SMIL (384)
...	...	...
/	CSS (620)	SMIL (739)

点状加载动画

预览图	CSS 大小（字节）	SMIL 大小（字节）
/	CSS (635)	SMIL (686)
...	...	...
/	CSS (1693)	SMIL (2714)

条状加载动画

预览图	CSS 大小（字节）	SMIL 大小（字节）
/	CSS (514)	SMIL (625)
...	...	...
/	CSS (1150)	SMIL (894)

块状加载动画

预览图	CSS 大小（字节）	SMIL 大小（字节）
/	CSS (1182)	SMIL (2133)
...	...	...
/	CSS (2457)	SMIL (4106)

脉冲加载动画

预览图	CSS 大小（字节）	SMIL 大小（字节）
/	CSS (301)	SMIL (381)
...	...	...
/	CSS (856)	SMIL (1973)

其他类型加载动画

预览图	CSS 大小（字节）	SMIL 大小（字节）
/	CSS (453)	SMIL (870)
...	...	...
/	CSS (999)	SMIL (1238)

请注意，以上表格展示了一系列不同类型的SVG加载动画预览图及其对应的CSS与SMIL文件的尺寸信息。这些动画适用于网页和应用中的加载指示，适应不同的偏好和需求。

适应性改造

Dephraiim的React SVG Spinners组件库

许可证

MIT © 乌尔卡尔什·维拉马