Agent Skills
› nexu-io/motion-anything
› attention-pulse
attention-pulse
GitHubattention-pulse 是一个用于引导用户注意力至单一核心元素（如主CTA或通知点）的柔和扩散光环动效。遵循无障碍规范，支持减少动态偏好，强调克制使用，避免同时出现多个脉冲或纯装饰用途。
Trigger Scenarios
需要突出显示单个主要操作按钮时
提示未读消息、新通知或徽章时
Install
npx skills add nexu-io/motion-anything --skill attention-pulse -g -y
SKILL.md
Frontmatter
{
"od": {
"mode": "prototype",
"preview": {
"type": "html"
},
"surface": "web",
"category": "animation-motion",
"platform": "desktop",
"upstream": null,
"design_system": {
"requires": false
},
"example_prompt": "Use attention-pulse on the primary CTA only: a soft expanding ring on a gentle loop, with a\nprefers-reduced-motion fallback. Just one pulsing element on the screen."
},
"name": "attention-pulse",
"triggers": [
"draw attention",
"pulse ring",
"notification dot",
"引导注意",
"脉冲提示"
],
"description": "A soft expanding ring that draws the eye to ONE element — a primary CTA, an unread badge, a new\ndot. Honors prefers-reduced-motion. One per screen; never use more than one at once or as pure\ndecoration (attention splits and nothing wins).\n"
}
attention-pulse
A soft expanding ring to draw the eye to one element. Part of
motion-anything; obeys MOTION-SPEC.md.
When to use it
- A single primary CTA, an unread/new badge, or a notification dot.
When NOT to use it (restraint)
- More than one pulsing element at once. As decoration with no real call to act.
How to apply
- Copy
attention-pulse.cssand link it. - Add
data-pulseto the element (set--pulse-colorto match your accent).
Accessibility & performance
prefers-reduced-motion: no pulse. Transform/opacity only (GPU-safe).
Version History
- b016900 Current 2026-07-11 17:07
