文字生成动画 · 为 SVG 添加动画

AI SVG 动画生成器

描述一个动态图标、标志或插画,或上传 SVG 并告诉 AI 助手哪些部分需要动起来。在同一个工作台中编辑图形和动画。

生成新的 SVG正在检查 AI 状态…
描述你的动画

正在检查 AI 状态…

结果

你的 SVG 将显示在这里

设置
px
背景
SVG

免费导出,无需注册,不消耗积分。

可编辑的矢量代码浏览器内导出文件无需登录即可下载
为你的创意准备

SVGBase 制作的 SVG 示例

试试旋转加载动画、漂浮插画或路径描边动画。载入示例,修改动画效果,再下载 SVG。

打开工作台

如何用 AI 制作 SVG 动画

  1. 从文字或已有 SVG 开始

    选择“生成动画”创建新设计,或通过“为 SVG 添加动画”上传文件、粘贴 SVG 代码,再描述哪些部分需要动起来。

  2. 描述想要的运动

    说明哪些部分需要运动、持续多长时间,以及循环还是单次播放。选择快速或高质量模式,生成前核对所需积分。

  3. 修改并预览

    继续描述对颜色、形状或运动的调整。可以播放、暂停或重新播放预览,点击“查看代码”直接编辑 SVG。

  4. 下载动画 SVG

    下载 SVG 可在独立文件中保留 CSS 动画。PNG、JPG 和 WebP 是动画第 1 秒的静态图片。

一个 SVG 动画工具,多种创作起点

Logo 和图标动画

为矢量图形添加轻量旋转、漂浮或脉冲效果,保留原有形状和完整的静止状态。

加载动画与路径描边

制作循环播放的加载指示器,或用 stroke-dashoffset 逐步显示路径。继续提出修改要求即可调整动画时序。

插画和简单时序

让指定分组运动或依次出现。从简洁的小型 SVG 开始,编辑结果更可靠。

当前支持哪些 SVG 动画

支持独立 SVG 内的 CSS 关键帧,可控制变换、不透明度、颜色和描边,以及循环、单次播放和错开播放时间。暂不支持脚本、外部资源、SMIL、任意路径形变、角色剧情动画、GIF、视频或 Lottie 导出。较大 SVG 的 AI 编辑可能超出当前容量,AI 助手会在扣费前检查。

SVG 动画常见问题

能用 AI 为已有 SVG 添加动画吗?

可以。选择“为 SVG 添加动画”,上传文件或粘贴 SVG 代码,再描述运动。导入和预览在本地完成,只有请求报价或生成时才会把源码发送到服务器。

SVG 动画生成器免费吗?

本地代码编辑、示例播放、移除动画和下载均免费。AI 生成和编辑消耗积分,执行前会显示所需积分。快速和高质量模式与首页 AI 助手共用账户余额,符合条件的账户可获得试用积分。

下载的 SVG 动画可以在哪里播放?

此 CSS 动画方案可直接打开、通过 img 嵌入或内联使用。部分内容管理系统、邮件客户端或内容过滤程序可能移除样式或禁用动画,请在目标环境中测试。文件提供静态替代显示,以适应「减少动态效果」偏好设置。

能导出 PNG、GIF 或视频吗?

SVG 文件保留动画。PNG、JPG 和 WebP 为第 1 秒的静态快照。当前版本不提供 GIF、视频或 Lottie 导出。

生成和修改 SVG 动画需要多少积分?

生成或编辑支持的静态及动画 SVG:快速模式每次 5 积分,高质量模式每次 10 积分。新用户赠送积分支持不超过 32 KiB 的局部编辑,购买或订阅积分支持不超过 64 KiB 的局部编辑,均另含固定 4 KiB 编辑余量。完整重写上限为 8 KiB。局部编辑包括颜色、不透明度、移动和呼吸动画。开始前会显示准确价格。请求失败会返还已扣积分。手动编辑、预览和导出免费。