UIPicks UI 参考库
← 全部 AI 参考来源

交互动效

Motion

JavaScript 与 React 动画库，适合查找动画实现方式与示例。

进入原站读取本页 JSON

已核对公开详情目录 · 2026-10-14。根据本次官网站点地图核对命名详情，排除站点导航、安装说明与类目；具体示例、文档与参考分别标识。

资源与访问条件

“有免费资源”仅描述对应资源范围，不代表每条案例、模板或素材免费。代码、提示词与素材的实际获取权限及许可需到原站核对。

目录入口

共 524 条记录，本页显示 241–320 条。每页最多 80 条；直接点击名称进入已保存的真实网址。

条目类型、来源日期与链接性质分别标注。只有明确核验过的画面才显示布局或风格标签；没有标签表示当前没有相应确认信息。

  1. Family-style dialog

    组件示例 · 具体条目入口 · JavaScript

    相关词：弹窗、对话框、模态框

    官网公开条目数据2026-10-14

  2. Family-style dialog

    组件示例 · 具体条目入口 · React

    相关词：弹窗、对话框、模态框

    官网公开条目数据2026-10-14

  3. Cursor: Image hover

    组件示例 · 具体条目入口 · Vue

    相关词：悬停、鼠标悬停、光标、鼠标、指针、图片

    官网公开条目数据2026-10-14

  4. Cursor: Image hover

    组件示例 · 具体条目入口 · React

    相关词：悬停、鼠标悬停、光标、鼠标、指针、图片

    官网公开条目数据2026-10-14

  5. Swipe actions

    效果示例 · 具体条目入口 · Vue

    相关词：滑动、手势

    官网公开条目数据2026-10-14

  6. Smooth tabs

    组件示例 · 具体条目入口 · Vue

    相关词：标签页、选项卡

    官网公开条目数据2026-10-14

  7. Hold to confirm

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  8. Multi state badge

    组件示例 · 具体条目入口 · Vue

    相关词：徽章、状态标签

    官网公开条目数据2026-10-14

  9. iOS Notifications stack

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  10. Scale correction

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  11. Split text

    效果示例 · 具体条目入口 · React

    相关词：文字、文本

    官网公开条目数据2026-10-14

  12. Scatter text

    效果示例 · 具体条目入口 · React

    相关词：文字、文本

    官网公开条目数据2026-10-14

  13. Wavy text

    效果示例 · 具体条目入口 · React

    相关词：文字、文本

    官网公开条目数据2026-10-14

  14. Hold to confirm

    效果示例 · 具体条目入口 · JavaScript

    官网公开条目数据2026-10-14

  15. Multi state badge

    组件示例 · 具体条目入口 · JavaScript

    相关词：徽章、状态标签

    官网公开条目数据2026-10-14

  16. Notifications stack

    效果示例 · 具体条目入口 · JavaScript

    官网公开条目数据2026-10-14

  17. Hold to confirm

    效果示例 · 具体条目入口 · React

    官网公开条目数据2026-10-14

  18. Characters remaining

    效果示例 · 具体条目入口 · JavaScript

    官网公开条目数据2026-10-14

  19. Characters remaining

    效果示例 · 具体条目入口 · React

    官网公开条目数据2026-10-14

  20. Multi state badge

    组件示例 · 具体条目入口 · React

    相关词：徽章、状态标签

    官网公开条目数据2026-10-14

  21. Loading: Circle spinner

    组件示例 · 具体条目入口 · Vue

    相关词：加载、加载动画、转圈

    官网公开条目数据2026-10-14

  22. Fill text

    组件示例 · 具体条目入口 · Vue

    相关词：文字、文本

    官网公开条目数据2026-10-14

  23. Loading: Jumping dots

    组件示例 · 具体条目入口 · Vue

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  24. Loading overlay

    组件示例 · 具体条目入口 · Vue

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  25. Loading progress bar

    组件示例 · 具体条目入口 · Vue

    相关词：加载、加载动画、进度条

    官网公开条目数据2026-10-14

  26. Loading ripple

    组件示例 · 具体条目入口 · Vue

    相关词：加载、加载动画、涟漪、波纹

    官网公开条目数据2026-10-14

  27. Loading: Pulse dots

    组件示例 · 具体条目入口 · Vue

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  28. Radix: Slider with AnimateNumber

    效果示例 · 具体条目入口 · Vue

    相关词：滑块、滑杆

    官网公开条目数据2026-10-14

  29. Radix: Accordion

    组件示例 · 具体条目入口 · Vue

    相关词：手风琴、折叠面板

    官网公开条目数据2026-10-14

  30. Radix: Checkbox

    组件示例 · 具体条目入口 · Vue

    相关词：复选框、多选框

    官网公开条目数据2026-10-14

  31. Radix: Context Menu

    组件示例 · 具体条目入口 · Vue

    相关词：菜单

    官网公开条目数据2026-10-14

  32. Radix: Dropdown Menu

    组件示例 · 具体条目入口 · Vue

    相关词：菜单、下拉菜单

    官网公开条目数据2026-10-14

  33. Radix: Progress

    组件示例 · 具体条目入口 · Vue

    相关词：进度条

    官网公开条目数据2026-10-14

  34. Radix: Radio Group

    组件示例 · 具体条目入口 · Vue

    相关词：单选框

    官网公开条目数据2026-10-14

  35. Radix: Select

    组件示例 · 具体条目入口 · Vue

    相关词：选择器、下拉选择

    官网公开条目数据2026-10-14

  36. Radix: Switch

    组件示例 · 具体条目入口 · Vue

    相关词：开关

    官网公开条目数据2026-10-14

  37. Radix: Toast

    组件示例 · 具体条目入口 · Vue

    相关词：消息提示、轻提示

    官网公开条目数据2026-10-14

  38. Radix: Toggle Group

    组件示例 · 具体条目入口 · Vue

    相关词：切换、开关

    官网公开条目数据2026-10-14

  39. Radix: Toolbar

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  40. Radix: Tooltip

    组件示例 · 具体条目入口 · Vue

    相关词：提示、气泡、工具提示

    官网公开条目数据2026-10-14

  41. iOS App Store

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  42. Apple Watch Home Screen

    效果示例 · 具体条目入口 · Vue

    相关词：首页、房子

    官网公开条目数据2026-10-14

  43. Modal: Shared layout

    组件示例 · 具体条目入口 · Vue

    相关词：弹窗、对话框、模态框

    官网公开条目数据2026-10-14

  44. Physical stagger

    组件示例 · 具体条目入口 · Vue

    相关词：交错、逐个出现

    官网公开条目数据2026-10-14

  45. Tab select

    组件示例 · 具体条目入口 · Vue

    相关词：选择器、下拉选择

    官网公开条目数据2026-10-14

  46. Image reveal slider

    组件示例 · 具体条目入口 · Vue

    相关词：滑块、滑杆、揭示、出现、入场、图片

    官网公开条目数据2026-10-14

  47. iOS slider

    效果示例 · 具体条目入口 · Vue

    相关词：滑块、滑杆

    官网公开条目数据2026-10-14

  48. Accordion

    组件示例 · 具体条目入口 · Vue

    相关词：手风琴、折叠面板

    官网公开条目数据2026-10-14

  49. Conic gradient pointer

    效果示例 · 具体条目入口 · Vue

    相关词：渐变、指针、鼠标

    官网公开条目数据2026-10-14

  50. Cursor: Adaptive caret size

    效果示例 · 具体条目入口 · Vue

    相关词：光标、鼠标、指针

    官网公开条目数据2026-10-14

  51. Cursor: Custom content

    效果示例 · 具体条目入口 · Vue

    相关词：光标、鼠标、指针

    官网公开条目数据2026-10-14

  52. Cursor: Follow

    效果示例 · 具体条目入口 · Vue

    相关词：光标、鼠标、指针

    官网公开条目数据2026-10-14

  53. Cursor: Multi-follow

    效果示例 · 具体条目入口 · Vue

    相关词：光标、鼠标、指针

    官网公开条目数据2026-10-14

  54. Line graph

    效果示例 · 具体条目入口 · Vue

    相关词：折线、线条

    官网公开条目数据2026-10-14

  55. Drag with spring follow

    效果示例 · 具体条目入口 · Vue

    相关词：拖拽、拖动

    官网公开条目数据2026-10-14

  56. Notifications list

    组件示例 · 具体条目入口 · Vue

    相关词：列表

    官网公开条目数据2026-10-14

  57. Reveal text effect

    效果示例 · 具体条目入口 · Vue

    相关词：揭示、出现、入场、文字、文本

    官网公开条目数据2026-10-14

  58. Tilt card

    组件示例 · 具体条目入口 · Vue

    相关词：卡片

    官网公开条目数据2026-10-14

  59. Typewriter

    效果示例 · 具体条目入口 · Vue

    相关词：打字机

    官网公开条目数据2026-10-14

  60. Variants

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  61. Loading: Circle spinner

    组件示例 · 具体条目入口 · JavaScript

    相关词：加载、加载动画、转圈

    官网公开条目数据2026-10-14

  62. Fill text

    组件示例 · 具体条目入口 · JavaScript

    相关词：文字、文本

    官网公开条目数据2026-10-14

  63. Loading: Jumping dots

    组件示例 · 具体条目入口 · JavaScript

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  64. Loading overlay

    组件示例 · 具体条目入口 · JavaScript

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  65. Loading progress bar

    组件示例 · 具体条目入口 · JavaScript

    相关词：加载、加载动画、进度条

    官网公开条目数据2026-10-14

  66. Loading ripple

    组件示例 · 具体条目入口 · JavaScript

    相关词：加载、加载动画、涟漪、波纹

    官网公开条目数据2026-10-14

  67. Loading: Pulse dots

    组件示例 · 具体条目入口 · JavaScript

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  68. Loading: Circle spinner

    组件示例 · 具体条目入口 · React

    相关词：加载、加载动画、转圈

    官网公开条目数据2026-10-14

  69. Fill text

    组件示例 · 具体条目入口 · React

    相关词：文字、文本

    官网公开条目数据2026-10-14

  70. Loading: Jumping dots

    组件示例 · 具体条目入口 · React

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  71. Loading overlay

    组件示例 · 具体条目入口 · React

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  72. Loading progress bar

    组件示例 · 具体条目入口 · React

    相关词：加载、加载动画、进度条

    官网公开条目数据2026-10-14

  73. Loading ripple

    组件示例 · 具体条目入口 · React

    相关词：加载、加载动画、涟漪、波纹

    官网公开条目数据2026-10-14

  74. Loading: Pulse dots

    组件示例 · 具体条目入口 · React

    相关词：加载、加载动画

    官网公开条目数据2026-10-14

  75. Physical stagger

    组件示例 · 具体条目入口 · JavaScript

    相关词：交错、逐个出现

    官网公开条目数据2026-10-14

  76. Physical stagger

    组件示例 · 具体条目入口 · React

    相关词：交错、逐个出现

    官网公开条目数据2026-10-14

  77. Parallax

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  78. Path drawing

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  79. Path morphing

    效果示例 · 具体条目入口 · Vue

    官网公开条目数据2026-10-14

  80. Reorder animation

    效果示例 · 具体条目入口 · Vue

    相关词：动画、动效

    官网公开条目数据2026-10-14