动效与动画

呼吸光晕 Pulse Glow

光晕周期性地扩散与收缩,像呼吸一样忽明忽暗

呼吸按钮

**呼吸光晕(Pulse Glow)**是让元素的光晕(box-shadow 扩散半径)和亮度以固定周期缓慢地增强又减弱,像人在呼吸。它和“闪烁(blink)“的区别是:呼吸是平滑的渐变,闪烁是生硬的开关——后者在 2026 年的审美里基本等于 bug。

什么时候用:状态指示灯(在线/录制中)、需要引导点击的按钮、地图上 pulsing 的标记点。快周期(1s 左右)传达“活动进行中”,慢周期(2~2.5s)传达“待命/在线”。

对 AI 说清楚的三要素:① 周期与节奏(12.4s,ease-in-out);② 光晕颜色与最大扩散半径(2030px,太大会糊);③ 亮度起伏幅度(1.25 倍封顶,过了刺眼)。

复制即用的提示词片段

状态指示点使用呼吸光晕(Pulse Glow):box-shadow 从 0 到 24px/6px
扩散再收回,同时 filter: brightness 1→1.25→1,周期 2.4s,
ease-in-out 无限循环,颜色跟随状态(正常=主题色,告警=红)。