# Animated Icon Generator

基于浏览器的图标工具，可选择图标并自定义颜色、尺寸、速度和循环次数，下载动画 SVG、静态 SVG 或 PNG 文件。

- Findings24: <https://findings24.com/zh-CN/tools/animated-icon-generator>
- 网站: <https://codequest.work/generator/animated-icon-generator/en>
- 价格: Freemium
- 分类: AI 动画生成器

## 什么是 Animated Icon Generator？

Animated Icon Generator 是一款基于浏览器的工具，可用于选择图标、调整可用的导出设置并下载可直接使用的文件。图标目录包含 300 个图标，涵盖操作、导航、通信、用户界面与装饰、天气、商业、开发、设备以及人物和健康等类别。

支持导出为动画 SVG、静态 SVG 或 PNG。动画 SVG 会将配置的动画行为保存在文件中；静态 SVG 提供不带动画的矢量版本；PNG 则提供透明背景的栅格图像版本，适用于不适合使用 SVG 的环境。该工具用于下载文件，而不是生成独立的 CSS 动画代码片段。

## Animated Icon Generator 能做什么？

### 包含 300 个图标的目录

浏览 300 个图标，图标按实用类别整理，包括导航、通信、用户界面、天气、商业、开发、设备以及人物和健康。

### 动画与导出控制

选择图标，并在下载前配置其颜色、导出尺寸、动画速度和循环次数。

### 三种输出格式

将结果下载为动画 SVG、静态 SVG 或 PNG，从而可在动画、矢量或栅格等场景中使用同一图标。

### 自包含的动画 SVG

配置的速度和循环次数会写入动画 SVG 的 CSS 中，因此文件嵌入后即可播放动画，无需添加外部 CSS 或 JavaScript。

### 透明 PNG 输出

当目标环境不支持 SVG 时可使用 PNG；导出的 PNG 具有透明背景。

### 宽松的使用条款

生成的图标可免费用于个人或商业用途，无需署名，也允许修改颜色、尺寸和形状。但不得将图标本身作为独立集合重新分发或出售。

## 使用场景

### 网站界面状态反馈

下载用于加载、成功、警告、错误、通知和进度等界面状态的动画 SVG 图标，然后使用 \`img\` 元素或 CSS 背景图像嵌入。

### 静态设计与印刷素材

当设计工具导入、编辑或面向印刷的工作需要不带动画的矢量图时，可选择静态 SVG。

### 受 SVG 限制的发布环境

当网站或发布系统无法上传或支持 SVG 时，可导出 PNG。这也是 WordPress 安装无法允许上传 SVG 时的文档化备用方案。

### 品牌化图标变体

调整图标颜色和导出尺寸，使其适合网站或界面，并使用允许的修改方式将下载的素材调整到项目中。

## 常见问题

### 如何创建并下载图标？

从目录中选择图标，在设置面板中设置颜色、导出尺寸、速度和循环次数，然后将其下载为动画 SVG、静态 SVG 或 PNG。

### 三种下载格式有什么区别？

动画 SVG 保留动态效果，并且缩放时不会损失矢量质量。静态 SVG 不会播放动画，仍可作为矢量图编辑。PNG 不会播放动画，具有透明背景，适用于无法使用 SVG 的环境。

### 下载后动画设置会保留吗？

会。配置的速度和循环次数会包含在动画 SVG 的 CSS 中，因此下载的文件嵌入其他位置时会使用这些设置。无论选择何种设置，目录预览本身都会在播放三次后停止。

### 生成的图标可以用于商业用途吗？

可以。图标可用于个人和商业项目，无需署名，也允许修改颜色、尺寸和形状。但不得将图标本身作为独立素材集合重新分发或出售。

### 可以将动画 SVG 上传到 WordPress 吗？

出于安全原因，WordPress 默认会阻止上传 SVG。你可以使用 SVG 上传插件，或在适当情况下修改网站允许的 MIME 类型；如果无法更改这些设置，请改用透明 PNG 导出。

## 快速信息

- **产品类型**: 动画图标生成器和下载工具
- **目录规模**: 300 个图标
- **输出格式**: 动画 SVG、静态 SVG 和 PNG
- **自定义选项**: 颜色、导出尺寸、动画速度和循环次数
- **许可**: 个人和商业用途免费；无需署名
- **源域名**: codequest.work