Agent Skills
› nexu-io/motion-anything
› glare-hover
glare-hover
GitHub为卡片添加跟随光标的柔和光泽效果，提升质感。支持自动挂载，无依赖。兼容触屏设备并尊重减少动态偏好设置，建议少量使用于核心卡片。
Trigger Scenarios
需要为卡片添加鼠标悬停光泽特效
希望实现轻量级、无依赖的交互式视觉反馈
Install
npx skills add nexu-io/motion-anything --skill glare-hover -g -y
SKILL.md
Frontmatter
{
"od": {
"mode": "prototype",
"preview": {
"type": "html"
},
"surface": "web",
"category": "animation-motion",
"platform": "desktop",
"upstream": "https:\/\/reactbits.dev\/animations\/glare-hover",
"design_system": {
"requires": false
}
},
"name": "glare-hover",
"triggers": [
"glare hover",
"sheen on hover",
"premium card hover",
"高光扫过",
"卡片光泽"
],
"description": "A soft glare sweeps across a card following the cursor on hover — a premium, tactile sheen. Keep it\nsubtle; a few hero cards, not a grid. Disabled on touch and under prefers-reduced-motion.\n"
}
glare-hover
A glare that follows the cursor across a card. Dependency-free, reduced-motion + touch safe.
How to apply
Copy glare-hover.css + glare-hover.js; <div class="glare"> … </div>. Auto-attaches; JS writes --gx/--gy.
Version History
- b016900 Current 2026-07-11 17:08
