UI FLOWKNOWLEDGE SYSTEM

色彩与装饰 · Color & Decoration

鼠标追踪效果
Mouse Tracking Effect

根据光标位置改变光晕、卡片倾斜、遮罩或局部高亮,让界面对用户动作产生即时回应。

An interaction style that responds to pointer position through glow, tilt, masks, or local highlight feedback.

交互预览

这是 mianhua UI Glossary 的原生 Preview Runtime,不是静态截图。

可以直接对 Agent 说

请为这个界面设计「鼠标追踪效果 / Mouse Tracking」。

角色:你是一名懂前端性能和交互反馈的动效设计师。

设计理念:鼠标追踪要让用户感到界面在回应自己,不是到处追着光点跑。效果必须服务可点击、聚焦或探索。

适用场景:创意作品集、AI 工具、产品首屏、定价卡片、图库、可探索数据和高质感营销页。不适合移动优先、表格密集和严肃办公流程。

视觉要求:可使用局部光晕、卡片轻微倾斜、边框高亮、遮罩揭示或磁吸按钮;亮度低、范围小、速度快,不能遮挡正文。

实现要求:使用 pointer events、CSS variables 或 requestAnimationFrame;限制重绘区域;支持键盘 focus 的等价反馈;移动端关闭或降级。

输出格式:给出触发区域、反馈类型、性能方案、降级策略、无障碍和反例。

相关可运行档案研究

该术语暂未建立精选案例映射,可从馆藏中继续搜索。

返回术语实验室 · 浏览完整馆藏 · 读取术语 API