web-resources动画组件库
说明
- 适合的动画能提升极大的使用体验~高大上必备
- 优秀的动画项目数不胜数,相信此处没有不能满足你需要的~
Animista
按需提供 CSS实时代码 自动前缀 CSS动画 CSS压缩 多种动画 动画模式多样 在线预览 在线调配定制 入出动画双模 文字动画 聚焦动画 背景动画
官方文档英文公网仓库Npm-React 版本体验示例全动画预览支持度&兼容性
| 支持CSS的环境即可 |
|---|
| ✔️ |
React Awesome Reveal 
高性能 轻量高效 React专属 简单可定制化 按需摇树 动画模式多样 TS 强调入场效果 多种效果 可自定义 动态导入
| React | 类React |
|---|---|
| ✔️ | ❓ |
React Simple Animate 
React专属 零依赖 完全遵循CSS动画标准 高度自定义化 注重过渡效果 可反向 延迟 关键帧 动画组
| React | 类React |
|---|---|
| ✔️ | ❓ |
GreenSock 
JS动画 极致性能 CSS动画 SVG动画 WebGL动画 Canvas动画 运动路径 变形滚动 高兼容性 高控制性 无限制 高定制必备 最强动画
| 支持JS的环境即可 |
|---|
| ✔️ |
Hover.css 
商业收费 CSS动画 专注Hover效果 超多特效 2D过渡 背景动画 图标动画 边框特效 气泡特效 卷轴特效 灵活精确 模块化 插件化
| 支持CSS的环境即可 |
|---|
| ✔️ |
Animate.css 
CSS动画 强调动画 入场动画 退场动画 跨浏览器 超多效果 在线体验 可定制
| 支持CSS的环境即可 |
|---|
| ✔️ |
Tsparticles Engine 
专注粒子动画 无视框架 无依赖 多框架支持 完全定制化 多种预设 CDN支持 在线调配预览 JS粒子 强大的 难得良品
| Angular | Inferno | jQuery | Preact | React | Riot | Solid | Svelte | Vue | Web Components | WordPress | Elementor |
|---|---|---|---|---|---|---|---|---|---|---|---|
| ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ✔️ |
Magic.css 
CSS动画 无视框架 效果特殊 极其轻量 按需定制 视觉特效 CSS高级设计 值的一试
| 支持CSS的环境即可 |
|---|
| ✔️ |
React Spring 
React专属 跨平台 弹簧物理引擎 声明性动画 极度流畅 动态调整动画效果 完善文档 活跃维护 动画事件 无视各类组件库
| React-Dom | React-Native | React-Three-Fiber | React-Konva | React-Zdog | 类React框架 |
|---|---|---|---|---|---|
| ✔️ | ✔️ | ✔️ | ✔️ | ✔️ | ❓ |
Typed.js 
打字机库 无视框架 速率配置 循环播放 来回切换 任意文本以打字方式呈现
| 理论JS运行环境即可 |
|---|
| ✔️ |
Vivus 
SVG路径库 零依赖 无视框架 使SVG动画化 定制绘制路径 延迟绘制 多SVG同步 路径分层绘制
| 理论JS运行环境即可 |
|---|
| ✔️ |
Popmotion 
12kb+极其轻量 JS动画 无视框架 运动动画引擎 拟物理效果 输入跟踪 原生支持CSS/SVG 开箱即用 弹簧关键帧
| 理论JS运行环境即可 |
|---|
| ✔️ |
Granim.js 
流体动画 无视框架 极其轻量 动画渐变 视觉渐变 循环渐变 多重渐变 渐变需求必备
| 理论JS运行环境即可 |
|---|
| ✔️ |
Framer Motion 
React专属 声明性动画 转换手势 动态动画 动态帧定制 3D支持 手势鼠标交互 CSS变量 SSR兼容 强力周边
| React | React SSR | 类React |
|---|---|---|
| ✔️ | ✔️ | ❓ |