反馈与交互 · 点一下的回应
高光扫过Glare sheen
- 材质
- 有反应
- 克制
指针一进去，一道斜的亮光从卡片上扫过去，同时指针那一小块微微提亮。它不改任何布局、不改颜色，只是「这块表面有反光」—— 卡片因此变成一个有厚度的东西。
什么时候用它
适合本来就有材质、想强调「这是一块表面」的卡片：商品卡、会员卡、图片卡。别在纯文字或大段内容的卡上用 —— 亮光扫过会打断阅读；也别让它一直循环，扫一次是对「指针进来了」的回应，一直扫就变成装饰。亮带要窄、要斜，正着的等宽亮带会被读成「加载中」。
参数
78px slanted band · 760ms sweep cubic-bezier(0.3, 0, 0.2, 1) · skewX −16° · 150px pointer spot, 150ms follow
配方
高光扫过 → 760ms cubic-bezier(0.3, 0, 0.2, 1)高光扫过 → 78px slanted band · 760ms sweep cubic-bezier(0.3, 0, 0.2, 1) · skewX −16° · 150px pointer spot, 150ms follow
给 AI 的一句话
做一道高光扫过：卡片上叠一条 78px 宽、斜 16 度的亮带（linear-gradient 两端透明、中间白 0.62），指针进入卡片的那一刻从左扫到右，760ms，两端各带一点缓动。同时另叠一层以指针为中心的 150px 径向光斑，透明度用 150ms 的一阶跟随淡入淡出，位置实时跟着指针。光斑和亮带都要 pointer-events: none，卡片要 overflow: hidden 把光裁在卡内。指针不在卡上时每 2.2 秒自己扫一次，作为「这里可以停一下」的提示。