动效组件
共 168 个设计师推荐的动效组件网站,按质量与推荐次数排序。
simpleParallax.js
轻量级视差滚动库,支持 React 与原生 JS,直接作用于 img/video 标签,无需背景图。
组件库RareUI
免费开源的 React 组件库,基于 Tailwind CSS 与 Framer Motion,复制粘贴即用。
区块 / SectionsZepa UI
面向 React 与 Next.js 的免费开源 UI 组件与 Hero 区块库,复制即用,兼容 shadcn 与 Tailwind。
动效组件Gooey React
一个轻量级 React 组件,用于实现粘性/融合效果(metaballs),优化清晰度并支持 Safari。
组件库Dot Matrix
基于 React、TypeScript、Tailwind 和 shadcn 的 55+ 免费开源点阵加载动画组件库。
Reactive Button
3D 动画 React 按钮组件,带进度条和状态提示,零依赖、轻量易用。
动效组件slidytabs
为 shadcn 的 Tabs 组件添加滑动指示器动画,无需改变原有用法即可获得流畅切换效果。
react-collapse
React 折叠动画组件,基于 react-motion,支持可变与动态高度内容的展开收起。
Eldora UI
免费开源的动画 UI 组件库,基于 React、TypeScript、Tailwind CSS 和 Motion 构建,含 150+ 组件与区块。
Bloom (Appear Here Styleguide)
Appear Here 的设计系统与 React 组件库,基于 Storybook 展示,含动效组件与表单控件。
qr-code
一个无框架、无依赖、可自定义且支持动画的 SVG 二维码 Web Component。
Thinking Orbs
面向 AI 界面的 React 动画状态指示器组件库,含思考、搜索等状态,零依赖仅 3.8KB。
react-awesome-button
React 3D 动画按钮组件,支持进度、社交分享,60fps 流畅动画,轻量且适合生产环境。
动效组件React Awesome Button
轻量高性能的 React 3D 按钮组件,支持进度、社交分享与多主题,60fps 动画。
react-anime
基于 anime.js 的 React 动画库,用组件和 props 轻松实现 CSS、SVG 与 DOM 动画。
auto-size-transition
一个 React 组件,能根据内部内容尺寸动态缩放,并带有平滑过渡动画。
gooey-react
一个仅 0.5 KB 的 React 组件,实现形状融合的黏糊(gooey)效果,支持 Safari。
Creatorem UI
基于 Radix 与 Motion 的 React 组件库,含 Tour、Stepper、文件上传等高级交互组件。
React Fancy Switch
基于 shadcn/ui 的无障碍动画开关/分段控件,无需 framer-motion 即可实现高亮滑动效果。
动画库Tilt.js
轻量级 jQuery 视差倾斜悬停效果库,基于 requestAnimationFrame,60+fps 流畅运行
ForgeUI
动画优先的 React 组件库,基于 shadcn/ui 与 Framer Motion,提供动效表单、卡片与 WebGL 背景。
react-instagram-zoom-slider
受 Instagram 启发的 React 轮播组件,支持双指捏合缩放图片,基于 react-spring 与 react-use-gesture。
react-lottie-player
一个用于 React 的声明式 Lottie 动画播放器组件,支持播放、暂停、跳转等控制。
DY Comps
基于 Next.js、TypeScript、ShadCN 与 Framer Motion 打造的精美 React 组件库,开源免费。