✨ 微光效果设置
👁️ 实时预览
📝 CSS代码
使用说明
CSS微光效果生成器帮助你快速创建shimmer/骨架屏加载动画。调整基础颜色、高亮颜色、动画速度和方向，实时预览效果并一键复制CSS代码。
微光效果常用于内容加载占位，给用户视觉反馈，提升用户体验。
常见问题
什么是骨架屏/微光加载效果？
骨架屏（Skeleton Screen）是一种加载占位UI，用灰色块模拟内容布局，配合微光（shimmer）动画效果，让用户感知内容正在加载。
微光效果的原理是什么？
通过CSS线性渐变背景+background-size放大+@keyframes移动background-position来实现高亮条从左到右扫过的动画效果。
如何优化微光效果的性能？
使用will-change: transform或contain: layout属性可以优化渲染性能。同时建议在内容加载完成后移除shimmer元素。