PNG 转 AVIF,不丢掉那份透明

递上一张 PNG,取回一张紧凑的 AVIF,其透明区域熬过转换的每一步。

或将图片拖放到此处

关于此工具

把 PNG 变成 AVIF,连同透明度一起保留。你拖入文件,页面读取你的 PNG,再把它写回为 AVIF,也就是源自 AV1 编解码的图像格式。AVIF 编码很重,所以为得到最干净的结果,Araluma在我们的服务器上运行它,若那条路不通,任务会退回到在浏览器中运行的编码器。编码是质量 85 的有损格式,照片约 42.6 dB PSNR,与原图足够接近,眼睛很少察觉差异,通常比同一张图保存为 WebP 轻 30 到 50 个百分点。JPG 会丢掉透明度,而 AVIF 原样保留完整的 Alpha 通道。每当一个文件到达我们的服务器,它就会被编码,结果会在大约 2 小时内清除。这一对适合追求为现代页面使用尽可能轻的透明素材的设计与前端开发。

把一张 PNG 做成 AVIF

把一张 PNG 做成 AVIF

把一张 PNG 拖进投放区,或轻点它去翻找一份文件。没有要去寻的转换按钮,文件一抵达活就开始。一段会话的开场那次会花掉约一秒来载入它的工具。从此一张小巧图像在大约四十毫秒里做完,一张一兆像素的照片约二百五十,一帧 4K 约二点八秒。任何超过八兆像素的,在手持设备上可能拉长到十或三十秒。AVIF 一现身,下载便把它以原名带 .avif 扩展名写出,尺寸读数把旧的与新的并排摆出。

透明会不会留存?

透明会不会留存?

会留存,而这份留存正是在此舍 JPG 取 AVIF 的全部用意。alpha 通道是 AVIF 自带的,于是进去时透明的像素出来时依旧透明。一枚浮在虚空上的徽标、一块边缘羽化的产品抠图、一个圆角图标,每一个都带着原封不动的蒙版落进 AVIF,背后没有白色矩形,边缘没有光晕。JPG 干脆做不到,它压根没有 alpha,会在原本透明之处涂上一块纯色。WebP 也能托住 alpha,可在同等画质下论尺寸却追不上 AVIF。对一件发往当代浏览器的透明作品来说,没什么比它更紧凑。

AVIF 到底轻多少?

AVIF 到底轻多少?

按住在画质 85,一张 AVIF 在照片上往往比 PNG 轻三到五成,比同一张图的 WebP 轻两到三成。一次开发测量把一张 4K 镜头从作为 JPG 的 116 KB 拉到作为 AVIF 的 16 KB。小图像照同样路数缩放,一张 17 KB 的 PNG 收到约 6 KB。早被压扁的源回报得更少,平涂色块的图形或硬边的徽标也许纹丝不动。自然照片交出最大的削减,而那恰是把多数产品页与 hero 区块撑胖的文件,省下的地方就在那里。

画面质量以及要费多久

画面质量以及要费多久

身为有损格式,AVIF 在此工作于固定的画质 85。照片在那个档位栖在 42.6 dB PSNR 附近,对寻常景物读来与 PNG 无异。爽脆的文字和纤细的线描是例外,在任何有损设置下都可能沾上隐隐的瑕疵,因此那些该待在一张 PNG 里。耗时随图像尺寸与引擎而走。桌面 Chrome 在约四分之一秒里处理一兆像素,在约二点八秒里处理八兆像素。Firefox 要花约四倍那么久,一部手机在其上再添三到五倍。开场那次会话也带着一段短短的预热,那时工具正点火。

你的文件在哪里被处理

你的文件在哪里被处理

AVIF 生产起来很吃力,所以为达到最佳质量与速度,Araluma在我们的服务器上运行这次转换,当服务器够不到时退回到浏览器中的编码器。也就是说转换时你的 PNG 可能会传到我们这里。处理很简单。文件变成 AVIF,结果回到你手中,两者都会在大约 2 小时内从我们的服务器清除。我们不保留你图像的副本,不要求账户,也不会把它用于你发起的转换之外。如果服务器路径不可用,编码会在你的浏览器中运行。无论哪条路,你都会得到相同的 AVIF,具有相同的 Alpha 通道和相同的质量。

AVIF 在 2026 年于何处可行

AVIF 在 2026 年于何处可行

覆盖率在 2026 年栖在全球约 94.3% 的浏览器上:Chrome 自 85 起,Firefox 自 93 起,Safari 自 16.4 起(iOS 16 往后),Edge 自 121 起。落在后头的是 Internet Explorer、Opera Mini,以及任何仍停在 iOS 15 或更早的东西。若你的访客有一片住在那儿,就以 AVIF 领头,让 picture 元素自动把他们落到 WebP。对今日多数流量那个回退鲜少点燃,因为 Chrome 与 Safari 扛着移动访问的大半,而二者自 2022 年起就原生地绘制 AVIF。

工作原理

  1. 加入你的 PNG

    把一张 PNG 拖进投放区,或轻点它打开文件浏览器并从你的设备里挑一张。

  2. 让它转换

    开场那次转换花掉约一秒来载入工具。同一标签页里其后的每一次都更利落。

  3. 比一比尺寸

    AVIF 备妥时,读数把 PNG 尺寸摆在新 AVIF 尺寸旁边,好让降幅一清二楚。

  4. 保存 AVIF

    按下载按钮把这份做好的文件写到你的设备,沿用原本的基础名加一个崭新的 .avif 扩展名。

接着转换

为兼容需要相反方向,还是想要 WebP 换取更快的转换与更广的支持?两者都只在一击之外。

常见问题

为什么把一张 PNG 做成 AVIF?

因为 AVIF 是当代浏览器肯绘制的最轻格式,而它在这么做的同时还守住透明。前端开发者与设计师为透明界面部件、产品抠图,以及那些必须保持下载廉价的图标而伸手取它。尺寸的削减是实打实的,常在大致相同的视觉画质下落在 PNG 之下三到五成,而 alpha 通道毫发无损地随行,换作一张 JPG 早把它抹去了。

透明会被保住吗?

会。AVIF 带着一条原生 alpha 通道,这一组把它笔直地放过去。PNG 里一块透明区域在 AVIF 里仍是透明。JPG 应付不来,它没有 alpha,会把一块纯色丢进那道缝隙,而 AVIF 待抠图、徽标与堆叠的图层一如 PNG,只是小得多。你从不必动手重画一张蒙版。

哪些浏览器能显示 AVIF?

每一个当代引擎都能。Chrome 自版本 85 起处理它,Firefox 自 93,Safari 自 16.4 连同 iOS 16,Edge 自 121。不能的是 Internet Explorer、Opera Mini,以及被撂在 iOS 15 的设备。要够到那条尾巴,把图片裹进一个 HTML picture 元素,先递 AVIF,等浏览器说不时落到 WebP 或 PNG。

AVIF 是有损还是无损?

AVIF 两样都撑,但此处的输出在画质 85 下有损。照片在那个档位读作约 42.6 dB PSNR,多数人辨不出它与源的差别。带硬边、纤细字体,或大片平涂色块的图像,在任何画质下都可能露出轻微瑕疵。当每一个像素都得分毫不差地吻合时,攥住 PNG 而别去转换它。

AVIF 还是 WebP,差别何在?

在画质相近的照片上,AVIF 跑得比 WebP 小约两到三成。WebP 以更宽的触及作答,连较老的 Safari 也算上,而 AVIF 在 2026 年罩住约 94.3% 的浏览器。当带宽是优先,受众又属当代,AVIF 胜出。当你需要够到每一个人,把 WebP 留在手边。2026 年那套常见安排先递 AVIF,在一个 picture 元素里把 WebP 摆在它身后。

转换会跑多久?

尺寸与引擎说了算。一段会话的开场那轮花掉约一秒把工具备好。一旦预热过,一张小图像在约四十毫秒里做完,一张兆像素照片近二百五十,一帧 4K 在 Chrome 里约二点八秒。越过八兆像素,一部手机也许要坐上十到三十秒。Firefox 以约 Chrome 四分之一的步速爬行,所以大活在 Chrome 里收尾更早。

详细信息

团队关于工艺、格式以及一个好的圆形裁剪背后小决定的笔记。

是什么让 AVIF 在尺寸上碾过 PNG
AVIF 骑在 AV1 引擎上,调校所向是眼睛接纳什么,而非逐字节的忠实。PNG 倚靠在原始像素上的 DEFLATE,无损,却对填满照片内容的冗余视而不见。AVIF 拿来自视频编码的块预测把戏换掉那份冗余,丢掉视觉系统从不登记的细节。回报很陡。那张 116 KB 照片在画质 85 下成了约 16 KB,而一张透明 PNG 通常相对相称的 WebP 落下三到五成。高分辨率照片把缝隙撑宽,而朴素图形把它收窄。任何把透明影像送往当代人群的站点,都把它换成更利落的页面与更轻的带宽账单。
沿着转换追踪 alpha 通道
PNG 与 AVIF 都把透明搁在紧挨颜色的一块独立 alpha 平面上。当这一组读你的 PNG 时,读取器把颜色像素与蒙版各自拽开。随后 AVIF 工具铺下一条它自家的崭新 alpha 轨,倚着 AV1 的帧内编码把颜色与蒙版一并在画质 85 下榨紧。透明从不熔进颜色,身后也从不得到一层填充。落下的阴影、羽化的边沿、半透明的渐变,全都忠实地渡过来。唯一的代价是 AVIF 也对 alpha 平面有损地压,那在你使劲放大时,可能在极硬的边缘四周留下几乎看不见的镶边。在寻常尺寸与画质 85 下它消失在视线外。至于微小尺寸里逐像素严丝合缝的图标活,守着 PNG。
逐个引擎的现实耗时
工具每段浏览器会话载入一次,取用约八百毫秒外加转起来的三百,于是开场那次转换披着约一秒的预热。每一次预热过的轮次都把它跳过。桌面 Chrome 在约四十毫秒里清掉 0.12 兆像素,在约二百五十里清掉一兆像素,在约二点八秒里清掉八兆像素。Firefox 拖在后头,要花约四倍那么久,这能把一帧 4K 推过三十秒。WebKit 上的 Safari 落在两者之间,更挨着 Chrome。中端手机一律比桌面 Chrome 慢三到五倍。若大文件是家常便饭,一段桌面 Chrome 会话是屋里最快的座。
PNG 该继续当一张 PNG 的时刻
即便分量要紧,仍有几样活非 PNG 不可。小尺寸下爽脆的文字,标签、徽章、或图标尺度的标记那一类,在 AVIF 里可能沾上近看读着糟糕的瑕疵。你打算往后再修的母版文件也归 PNG,因为每一趟穿过有损格式都把损耗摞高。一些去处把 AVIF 干脆拒之门外,某些文档编辑器、老旧的设计套件,连同好几款邮件客户端在内,它们要 PNG。第一帧之后的动画在这里也落空,因为这一组料理单帧。在其余每一处,对发往一个当代站点的透明照片与图形而言,PNG 到 AVIF 就是这一着。
用数字摆 Core Web Vitals 这桩案子
Largest Contentful Paint 这条头号载入指标,直直地回应页面上最大那张图的尺寸。把那张图从 116 KB 拿到 16 KB,正是测试里在一张 4K 照片上量到的数,就这一个元素而言,在一条 10 Mbps 线上把它的传输从约九十三毫秒削到约十三。把同一笔削减摊到一面产品网格、一个轮转 hero,或一个塞满透明图标的界面,总数便从容地把 LCP 拽到 Google 读作良好的 2.5 秒标线之下。AVIF 的这桩案子立得住,正因为它能以赤裸的数字来辩。在近 94.3% 的覆盖下,回退稀罕到带宽的赢面盖过那点多出来的 picture 标记。
它与常见在线转换工具的区别
几乎每个在线 AVIF 转换工具都会把你的 PNG 送往远程硬件,然后按该运营者所持的保留规则保存结果,而这些规则往往含糊不清。Araluma对其工作方式很明确。由于 AVIF 很重,为得到最干净的结果,转换在我们的服务器上运行,当服务器够不到时浏览器中的编码器会自行接手。当你的文件到达我们这里,它会被编码,然后在大约 2 小时内清除,不要求账户,也不会用于你发起的转换之外。没有长期存储,也不会共享。对于处理客户工作、未发布的产品照片或用户内容的人来说,这笔交易诚实的形态是这样的:文件可能经过我们的服务器,仅为构建你的 AVIF 而被触及,并且不会逗留。