← ToolBox / 骨架屏生成器

💀 Skeleton Loader Generator

📐 计算公式 / 原理

骨架屏 = 占位色块（列表 / 卡片 / 图文）叠加 shimmer 流光动画（背景位移动画）；配置圆角、间距与闪烁后导出 CSS，用于加载占位。

类型

基础色

高亮色

动画速度 (秒)

圆角 (px)

预览

📚 深度解析：骨架屏生成器

生成卡片骨架

输入：圆角块、微光动画。处理：组合占位块。输出：CSS 与预览。

和 spinner 区别？: 骨架屏模拟内容结构，比转圈更能降低等待焦虑。
什么时候用？: 内容加载预期长时用骨架屏；极短加载用 spinner 即可。
会保存或上传我的内容吗？: 结果以浏览器实时计算为准，纯前端本地处理、数据不上传；生成的样式与代码仅作快速产出参考，正式项目请以设计系统、规范与浏览器实测为准。

⚠️ 使用说明与注意事项

📖关于「骨架屏生成器」 ▼

Configure list, card or media skeleton placeholders with adjustable radius, spacing and shimmer, and export the CSS.