轻提示 Toast
屏幕边上飘一下就消失的小条:「已保存」「复制成功」——不打断你手上的事。
Skeleton Screen
数据来之前先摆出的灰色轮廓:标题是灰条、图是灰块,一道微光扫过表示在加载。
骨架屏用与真实内容同尺寸的灰块先占住版式,数据到了原地替换,页面不跳、不晃。它卖的是「已经在加载了」的确定感,比白屏和转圈都更让人愿意等。
结构已知、内容未知的加载场景:信息流、详情页、个人中心。
加载快于 300ms 的场景别上骨架(一闪而过反而像故障);结构未知的生成式内容用进度提示。
配套效果见下方「可用效果」。
纯 CSS 加载动画合集:600+ 个 spinner 与 loader,复制一段 CSS 就能用。
React + Tailwind 的动效组件集:跑马灯、光晕、数字滚动都有,本站效果库的重要参考生态。