01 · 从一张原图开始
选择一张高分辨率图片，并按页面布局设置宽度和格式。原始文件不会被修改。
可发布的图片资源 / 01
网站图片资源生成器
一张原图，适配各种屏幕。导出完整图片集和响应式 HTML，直接用于网站。
一张图片，适配网站
你的发布资源包
320px640px1280px
一张原图，适配各种屏幕。
比较实际文件大小，再下载图片和响应式 HTML。
生成后即可查看实测大小，不使用估算或预填结果。
从一张图片到完整资源包
02 · 比较实际结果
生成文件后，选择一行即可预览，并比较各宽度下的实际文件大小。
03 · 下载完整资源包
设置替代文本和 sizes 属性，然后用一个 ZIP 下载图片、HTML 和文件清单。
发布之前
调整尺寸和编辑会生成新文件。请保留原图和必要署名，并按要求披露 AI 使用情况。
常见问题
ZIP 中包含哪些文件？
包含编码后的图片、picture.html 代码片段、记录尺寸和字节大小的清单，以及简短使用说明。HTML 引用与实际导出文件名一致。
工具会放大图片吗？
不会。每个宽度均以原图宽度为上限，重复宽度会合并，图片保持原比例，HTML 使用实际输出尺寸。
每种格式都能保留透明背景吗？
WebP 和 AVIF 可以保留透明度。JPG 不支持透明，会使用所选背景色。关闭透明度后，所有格式都会铺设该背景色。
如何使用 srcset 和 sizes？
将图片放在导出的 HTML 旁，或将 URL 改为资源目录。根据各断点的实际 CSS 显示宽度设置 sizes，浏览器会从列出的宽度中选择图片。首屏主图请移除懒加载。
导出是无损的，或会保留元数据吗？
不是。图片会调整尺寸并重新编码，不会复制原始元数据。压缩可能改变细节和颜色表现。请保留原图中的编辑、来源和版权记录。如需不重新编码且经过验证的元数据清理，请使用 AI Metadata Checker。