1 选择图片
抓住某一帧的 把手拖动就能重排,也可以用每一帧上的箭头。这里的顺序就是它们播放的顺序。
GIF以百分之一秒记录停留时间。为保持指定的整体帧率,相邻帧的停留时间可能相差0.01秒。
2 GIF 设置
颜色数 颜色越少,文件越小,色带越明显。
抖动 做 logo、线稿和截图时把它关掉。
添加图片后就能看到预览
- 帧数
- —
- 时长
- —
- 画面尺寸
- —
- 播放
- —
3 做出 GIF
# GIF 制作 — 把图片做成动图 把一组图片变成一段动画。 > 把 JPG、PNG、WebP 或 AVIF 图片做成 GIF 动图,免费,全程在浏览器里完成。顺序、快慢和尺寸都由你定。什么都不上传,断网也能用。 这是一个浏览器交互工具,地址是 https://abox.tools/zh/gif-maker/。文件在运行该浏览器的设备上处理。主动分享和可选联网功能都在页面上说明。下文是它的文字说明;使用工具请打开该地址。 ## 你的图片**在浏览器里处理**,无须上传处理。 每一帧都由你自己的浏览器绘制、量化和压缩,做好的 GIF 也是在这台机器的内存里拼起来的。就算这里有什么东西想把图片送走,页面的另一端也根本没有服务器可以接。 - ✗ 不上传 - ✗ 不注册 - ✓ 断网可用 - ✓ 开源 - ✓ 文件不出这台机器 ## 用图片做 GIF 的步骤 1. **选好你的图片。** 把一个文件夹拖到选择框里,或者自己挑文件。浏览器直接从磁盘上读,这期间没有任何东西发往别处。 2. **按播放顺序排好。** 抓住把手拖动,或者用箭头。“按名称排序”是按你以为的方式数数的,所以 `frame_2` 会排在 `frame_10` 前面。 3. **定下每一帧停多久。** 每张半秒是幻灯片,二十分之一秒就是动画了。可以一次给所有帧同一个时长,也可以单独让某一张多停一会儿。 4. **选尺寸,并决定颜色怎么挑。** GIF 的体积随面积和帧数一起涨,而且没有画质滑杆能把它拉回来,所以尺寸才是最要紧的那个设置。每帧 256 色最好看,也是默认值;共用一套调色板则更小、更稳。 5. **做出 GIF,然后下载。** 它是在你自己的硬件上拼出来的,所以花多久取决于你的机器,而不是排队。做好的动画会先在页面上放一遍,然后你再保存。 ## 说得更细的版本 [怎么用图片做一个动图 GIF](https://abox.tools/zh/guides/make-a-gif-from-images/): 把一组图片变成一个动图 GIF:GIF 到底能放多快、调色板那个选项改的是什么,以及真正能让文件变小的三件事。 ## 工具箱里还有 - [GIF 拆帧](https://abox.tools/zh/split-gif/): 每一帧都单独存成一张 PNG。 - [GIF 分析](https://abox.tools/zh/gif-analyzer/): 帧、延时、调色板,以及每个字节的去向。 - [视频压缩](https://abox.tools/zh/compress-video/): 说一个它最多能有多大。剩下的工具来算,做完先量一遍再交给你。 - [MP4 转换](https://abox.tools/zh/convert-to-mp4/): 不管从录屏、压制还是相机里出来的是什么,都变成 MP4 里的 H.264 和 AAC。能复制的原样复制,非改不可的才重新编码。 ## 常见问题 ### 我的图片会被传到哪里去吗? 不会。你的图片由你自己的浏览器在你自己的硬件上读取、绘制、量化和压缩。这个工具没有服务端,页面的 `Content-Security-Policy` 里写着它允许联系的每一个地址,没有一个属于本站。拔掉网线,它照样做 GIF。 ### 能用哪些图片格式? 凡是你浏览器能解码的静态图片格式都行,实际上就是 JPG、PNG、WebP、GIF、AVIF,在苹果设备上还有 HEIC。这里没有另外一份需要维护的清单,因为解码是浏览器的活,不是我们的。 ### 我的 GIF 为什么这么大? 因为 GIF 把每一帧都当作完整像素来存。没有运动补偿,没有“和上一帧一样、只是挪了个位置”这种存法,也没有画质旋钮:体积大约就是面积乘帧数,能把它压下来的只有三件事。 \ \ 做小一点:尺寸减半,文件就只剩四分之一。少用几帧,或者让每一帧停久一点。降到 64 色或 32 色,并关掉抖动——对平涂画面来说这代价比听上去小,对照片来说则很大。要是还塞不下,老实说,你在做的其实是视频,同样的内容做成 MP4,大概只有十分之一大。 ### GIF 最快能放多快? 没有那个数字看上去那么快。这个格式把每帧的停留时间按百分之一秒来存,而从九十年代起,浏览器就把小于两个百分之一秒的值一律抬到十分之一秒。这条规矩是为当年那些转动的地球图写的,后来一直没删。所以 0.01 秒并不会按每秒 100 帧来播,而是每秒 10 帧。正因如此,这个工具不提供低于 0.02 秒的选项,而 0.05 秒(每秒 20 帧)差不多就是值得去要的上限了。 ### 调色板这个设置改的是什么? GIF 的一帧最多装 256 种颜色,总得有人来挑这 256 种。 \ \ **每帧各自最合适的颜色**会给每一张图单独挑 256 种,看起来最清爽,一组互不相干的照片就该这么选。**整个 GIF 共用一套调色板**则把所有帧放在一起,只建一张表。文件更小,而且能消掉同一场景各帧之间调色板来回跳所造成的闪烁,所以当这些帧是一段连续画面而不是一堆合集时,就选它。 ### 能保留透明背景吗? 能,只要你的图片本身有:把“透明”改成“保留透明区域”。不过动手前有件事得知道。GIF 的透明只有一位,一个像素要么完全看不见,要么完全画上去,中间没有过渡,所以抗锯齿的边缘、柔和的阴影,以及任何渐隐的东西,都会变成硬边。要是你的动画会放在一个你已知颜色的背景上,那把它压到那个颜色上会更好看。 ### 能用的图片张数有上限吗? 工具里没有写死的上限。真正的天花板是你机器的内存,以及你对出来那个文件大小的耐心:图片是一张一张读的,所以一百帧没问题,但 640 像素的一百帧同样是个非常大的 GIF。见上面的“我的 GIF 为什么这么大?”。 ### 它免费吗,需要注册吗? 免费,没有账号,不用登录,也没有试用期。出来的文件上同样没有水印。本站带广告,经费就是从那儿来的,广告拿不到任何关于你图片的信息。 ### 断网能用吗? 能。页面加载一次之后断开网络,它照样干活。这也是证明“什么都没上传”最省事的办法,真要把你的图片送出去处理,拔线那一刻就停了。 ## 这条隐私承诺怎么核实 - **处理在这个浏览器里完成。** 本工具在浏览器里处理输入和结果,处理代码不把它们上传去处理。Content-Security-Policy 限制可用资源和连接目的地,但已允许的主机仍可接收请求。策略不检查载荷,不能单独证明什么都没有发出。请把具体操作的请求与源码核对,或断网完成该本地操作。 - **编码器就是仓库里的四个文件。** 做一个 GIF 需要颜色量化和 LZW 压缩,而浏览器这两样都不提供,所以两样都在这儿写了出来:`src/quantize.js` 和 `src/lzw.js`,容器部分在 `src/gif.js`。做一个 GIF 不需要去取任何东西,第一次用也不会下载什么引擎。 - **Google 加载了什么,又拿不到什么。** 广告脚本和统计脚本来自 Google。关于你图片的信息,一条也没有交给它们,文件、缩略图、名字、尺寸、张数都没有。读取、解码、绘制、压缩图片的每一行代码都由这个源提供,也都摆在仓库里。 - **捐助按钮加载了什么,又拿不到什么。** 页首那个“Buy me a coffee”按钮由 cdnjs.buymeacoffee.com 的脚本画出来,字体取自 Google Fonts。它不过是个链接,不上报访问,也拿不到关于你或你图片的任何东西。不点它就什么都不会发生,点下去到的是别人的站。 - **断网也照样能用。** 断开网络,这个页面上每一部分都照常工作。这是最省事的一条证明,真要把你的图片送出去做成 GIF,拔线那一刻就停了。 **你可以自己核对。**上面这些不用你信。这个页面是仓库里的模板和配置生成出来的,构建脚本你能读,也能自己跑一遍,跑出来的结果就提交在 `dist` 分支上。拿实际发给你的内容,跟你自己从源码构建出来的结果对一遍就知道了: https://github.com/A-Box-of-Tools/website 最值得先读的几个文件:`config/site.toml` 里是 Content-Security-Policy,把每一帧落到哪套调色板上由 `src/quantize.js` 决定,压缩器和它写进去的那个文件则在 `src/lzw.js` 和 `src/gif.js` 里。这些文件里都没有一行能碰到网络的代码。
用图片做 GIF 的步骤
- 选好你的图片。把一个文件夹拖到选择框里,或者自己挑文件。浏览器直接从磁盘上读,这期间没有任何东西发往别处。
- 按播放顺序排好。抓住把手拖动,或者用箭头。“按名称排序”是按你以为的方式数数的,所以
frame_2会排在frame_10前面。 - 定下每一帧停多久。每张半秒是幻灯片,二十分之一秒就是动画了。可以一次给所有帧同一个时长,也可以单独让某一张多停一会儿。
- 选尺寸,并决定颜色怎么挑。GIF 的体积随面积和帧数一起涨,而且没有画质滑杆能把它拉回来,所以尺寸才是最要紧的那个设置。每帧 256 色最好看,也是默认值;共用一套调色板则更小、更稳。
- 做出 GIF,然后下载。它是在你自己的硬件上拼出来的,所以花多久取决于你的机器,而不是排队。做好的动画会先在页面上放一遍,然后你再保存。
说得更细的版本
怎么用图片做一个动图 GIF 把一组图片变成一个动图 GIF:GIF 到底能放多快、调色板那个选项改的是什么,以及真正能让文件变小的三件事。
工具箱里还有
常见问题
我的图片会被传到哪里去吗?
不会。你的图片由你自己的浏览器在你自己的硬件上读取、绘制、量化和压缩。这个工具没有服务端,页面的 Content-Security-Policy 里写着它允许联系的每一个地址,没有一个属于本站。拔掉网线,它照样做 GIF。
能用哪些图片格式?
凡是你浏览器能解码的静态图片格式都行,实际上就是 JPG、PNG、WebP、GIF、AVIF,在苹果设备上还有 HEIC。这里没有另外一份需要维护的清单,因为解码是浏览器的活,不是我们的。
我的 GIF 为什么这么大?
因为 GIF 把每一帧都当作完整像素来存。没有运动补偿,没有“和上一帧一样、只是挪了个位置”这种存法,也没有画质旋钮:体积大约就是面积乘帧数,能把它压下来的只有三件事。
做小一点:尺寸减半,文件就只剩四分之一。少用几帧,或者让每一帧停久一点。降到 64 色或 32 色,并关掉抖动——对平涂画面来说这代价比听上去小,对照片来说则很大。要是还塞不下,老实说,你在做的其实是视频,同样的内容做成 MP4,大概只有十分之一大。
GIF 最快能放多快?
没有那个数字看上去那么快。这个格式把每帧的停留时间按百分之一秒来存,而从九十年代起,浏览器就把小于两个百分之一秒的值一律抬到十分之一秒。这条规矩是为当年那些转动的地球图写的,后来一直没删。所以 0.01 秒并不会按每秒 100 帧来播,而是每秒 10 帧。正因如此,这个工具不提供低于 0.02 秒的选项,而 0.05 秒(每秒 20 帧)差不多就是值得去要的上限了。
调色板这个设置改的是什么?
GIF 的一帧最多装 256 种颜色,总得有人来挑这 256 种。
每帧各自最合适的颜色会给每一张图单独挑 256 种,看起来最清爽,一组互不相干的照片就该这么选。整个 GIF 共用一套调色板则把所有帧放在一起,只建一张表。文件更小,而且能消掉同一场景各帧之间调色板来回跳所造成的闪烁,所以当这些帧是一段连续画面而不是一堆合集时,就选它。
能保留透明背景吗?
能,只要你的图片本身有:把“透明”改成“保留透明区域”。不过动手前有件事得知道。GIF 的透明只有一位,一个像素要么完全看不见,要么完全画上去,中间没有过渡,所以抗锯齿的边缘、柔和的阴影,以及任何渐隐的东西,都会变成硬边。要是你的动画会放在一个你已知颜色的背景上,那把它压到那个颜色上会更好看。
能用的图片张数有上限吗?
工具里没有写死的上限。真正的天花板是你机器的内存,以及你对出来那个文件大小的耐心:图片是一张一张读的,所以一百帧没问题,但 640 像素的一百帧同样是个非常大的 GIF。见上面的“我的 GIF 为什么这么大?”。
它免费吗,需要注册吗?
免费,没有账号,不用登录,也没有试用期。出来的文件上同样没有水印。本站带广告,经费就是从那儿来的,广告拿不到任何关于你图片的信息。
断网能用吗?
能。页面加载一次之后断开网络,它照样干活。这也是证明“什么都没上传”最省事的办法,真要把你的图片送出去处理,拔线那一刻就停了。