使用方法
- 打开页面默认就带示例:原图宽 1920、高 1080、目标比例 4:3,结果区已经显示输出 1440×1080 与左右各裁 240,你不需要先输入任何东西。
- 把你的原图宽高填进对应输入框,再从下拉选择目标比例,支持 16:9、4:3、1:1、9:16、3:2、2:3。
- 在任意输入框里按回车也能立即计算,不必点按钮;结果区是当场算出来的,不是固定文案。
- 点「计算裁剪尺寸」按钮,页面比较原图比例与目标比例,决定裁宽还是裁高,再算中央内接矩形的输出尺寸与裁剪像素;点「复制结果」复制文字。
- 宽高为空或不是正数时会点名当前字段提示你补全,不会硬凑出一个错误尺寸,避免你误以为计算成功。
- 本页不联网、不写本地存储,刷新即回到默认示例,所有计算都在你自己的浏览器里完成,输入内容不会离开设备。
这个 按宽高比裁剪图片 能解决什么
按宽高比裁剪图片 解决的是「同一张图要适配多种画幅」这个日常痛点。封面要 16:9、头像要 1:1、故事要 9:16,手动估裁剪位置既慢又容易把主体切歪。本工具按中央最大内接矩形计算,保证主体居中、比例精确,复制尺寸即可去图像软件里照着裁。
第一类用途是社媒配图适配。一张产品图要同时发横屏微博、方形头像和竖屏故事,用本工具分别算三种比例的输出尺寸,裁剪框位置一目了然,不必反复试错。
第二类用途是网站与 App 封面规范。开发按设计稿要求生成固定比例的缩略图,提前算出源图要裁掉多少,能避免上线后图片被强制拉伸变形。
第三类用途是印刷与海报排版。印刷对画幅要求严格,本工具把原始像素换算成目标比例的可见区域,方便你在排版软件里精确放置裁切参考线。
第四类用途是批量处理前的尺寸预估。处理一堆图片前,先拿代表尺寸算一遍,确认裁剪损失在可接受范围,再决定是否换原图或换比例。
第五类用途是教学与记忆。很多人搞不清「什么时候裁宽、什么时候裁高」,把原图比与目标比对比一下就懂:原图更宽就裁左右,原图更高就裁上下。本工具把判据直观展示出来。
第六类用途是视频封面与缩略图。视频帧导出后常要改成规定比例,本工具给出居中裁剪参数,能保持画面重点不被切掉。
第七类用途是文档与教程里的示例展示。写技术文档、录教学视频时,常常需要把同一张图在不同比例下的裁剪结果摆在一起,读者才能直观对比。本工具把尺寸并排输出,截图或复制都方便。
值得一提的是,本页所有计算都在本地完成,不联网也不上传。你可以放心粘贴项目真实尺寸,结果不会被任何服务器记录,这点和需要登录的在线工具不同,更适合处理未公开素材。
原理和变量
按宽高比裁剪图片 的核心是「中央最大内接矩形」,不含随机成分,因此同一组输入永远得到同一组输出,可被手算复核。先算目标比例 A=目标宽/目标高;若原图宽高比(W/H)大于 A,说明原图相对更宽,就固定输出高=原图高,输出宽=round(原图高×A),左右两边各裁 (原图宽−输出宽)/2;否则原图相对更高或更窄,固定输出宽=原图宽,输出高=round(原图宽/A),上下两边各裁 (原图高−输出高)/2。这样得到的矩形恰好是能放进原图、且比例正确的最大一块,并居中。
为什么取「最大内接矩形」?因为要在不拉伸、不变形的前提下尽量保留原图信息,最大矩形既满足比例又损失最少;居中则保证视觉主体不被偏移。下面变量表说明各环节含义。
| 变量 | 含义 | 说明 |
|---|---|---|
| W,H | 原图宽高 | 像素,正整数 |
| A | 目标比例 | 目标宽/目标高 |
| ow,oh | 输出宽高 | 内接矩形尺寸 |
| trim | 裁剪总量 | W−ow 或 H−oh |
| each | 单边裁剪 | trim 的一半,居中 |
完整示例
下面这组示例全部由页面算法原样得出,可直接对照你的手算。原图 1920×1080、目标 4:3(A=4/3≈1.3333),原图宽高比 1920/1080≈1.7778 大于 A,所以固定输出高=1080,输出宽=round(1080×1.3333)=1440,左右共裁 1920−1440=480,单边各 240。与上方结果区、下方卡片和对照表完全自洽,全程无随机、可逐字复核。如果你改成 16:9(A≈1.7778),原图比正好等于 A,则无需裁剪,输出就是 1920×1080,算法始终不变。
如果你想验证手算,只要比较 W/H 与 A 谁大,决定裁宽还是裁高,再用对应公式算输出与单边裁剪量,必然和本工具一致。这个内接矩形法也是你在不支持本页的环境里手动复现结果的可靠办法。
1920×1080
目标 4:3
1440×1080
左右各 240 px
示例输入:原图宽 1920、原图高 1080、目标比例 4:3 输出宽 1440 × 输出高 1080 左右各裁 240 px(共 480 px)
常见尺寸与比例对照表
下表列出常见原图在六种比例下的裁剪结果(共 14 行),前 12 行直接展示,点「加载更多」展开剩余项。你可以一键导出 CSV(带 BOM,Excel 直接认中文)或复制 TSV 粘进表格软件。表里所有结果都由本页同一逻辑得出,无随机、可复核。
| 原图宽 | 原图高 | 目标比例 | 输出宽 | 输出高 | 单边裁剪 |
|---|---|---|---|---|---|
| 1920 | 1080 | 4:3 | 1440 | 1080 | 左右各 240 |
| 1920 | 1080 | 16:9 | 1920 | 1080 | 无需裁剪 |
| 1920 | 1080 | 1:1 | 1080 | 1080 | 左右各 420 |
| 1080 | 1920 | 9:16 | 1080 | 1920 | 无需裁剪 |
| 1500 | 1000 | 3:2 | 1500 | 1000 | 无需裁剪 |
| 1000 | 1500 | 2:3 | 1000 | 1500 | 无需裁剪 |
| 800 | 600 | 16:9 | 800 | 450 | 上下各 75 |
| 600 | 800 | 2:3 | 533 | 800 | 左右各 33.5 |
| 1280 | 720 | 4:3 | 960 | 720 | 左右各 160 |
| 720 | 1280 | 9:16 | 720 | 1280 | 无需裁剪 |
| 1000 | 1000 | 16:9 | 1000 | 563 | 上下各 218.5 |
| 2048 | 1536 | 3:2 | 2048 | 1365 | 上下各 85.5 |
| 1366 | 768 | 16:9 | 1365 | 768 | 左右各 0.5 |
| 500 | 500 | 4:3 | 500 | 375 | 上下各 62.5 |
结果边界与错误提示
- 原图宽为空时,提示「原图宽不合法:请填写正整数」,不会把空值塞进矩形计算。
- 原图高为空或不是正数时,提示「原图高不合法:请填写正整数」,因为宽高都必须大于 0 才有意义。
- 原图宽或高小于等于 0 时,提示对应字段「不合法:必须大于 0」,避免算出无意义的负尺寸。
- 当原图比例正好等于目标比例时,输出等于原图,单边裁剪显示「无需裁剪」,这是预期行为而非错误。
- 结果区与错误区都带 role="alert" 语义,内容一变就会被屏幕阅读器播报;所有计算本地完成,不联网也不写存储,刷新即还原默认示例。
- 输出宽高按四舍五入取整,单边裁剪量因此可能出现 0.5 像素的余数,实际裁剪时左右(或上下)可各取相邻整数,总量仍守恒。
- CSV 导出在文件头写入 UTF-8 BOM(\ufeff),Excel 打开中文不会乱码;TSV 复制是纯制表符分隔文本,粘进任意表格软件都会自动分列。
- 本工具只算裁剪尺寸,不真正修改图片;拿到尺寸后请在图像软件里按居中位置裁切,避免主体偏移。
常见问题
什么时候裁左右,什么时候裁上下?
比较原图宽高比(W/H)与目标比例 A:若 W/H 大于 A,原图更宽,就裁左右;否则原图更高或更窄,就裁上下。本工具自动判断并居中裁剪。
为什么是「最大内接矩形」?
因为要在不拉伸、不变形的前提下尽量保留原图信息。最大矩形既满足目标比例又损失最少,且居中放置能保证主体不被切偏。
单边裁剪出现 0.5 像素怎么办?
这是输出宽高四舍五入取整带来的余数。实际裁剪时左右(或上下)各取相邻整数即可,总裁剪量仍然守恒,不影响整体比例。
我的图片尺寸会上传吗?
不会。所有宽高只在浏览器本地参与计算,不联网、不写存储,刷新即还原默认示例,没有任何数据离开你的设备,可以放心填写真实尺寸。
支持哪些比例?
支持 16:9、4:3、1:1、9:16、3:2、2:3 六种常见画幅;这已覆盖绝大多数社媒、网站与印刷场景,选好即可立即计算。
导出的 CSV 为什么带 BOM?
因为 Excel 打开无 BOM 的 UTF-8 文件时常把中文显示成乱码,BOM 能让 Excel 正确识别编码。TSV 复制走剪贴板不经文件,所以不需要 BOM。
算出来还要自己裁图吗?
本工具只给出精确的裁剪尺寸与居中位置,不直接改动图片。你按输出宽高在图像软件里居中裁切即可,保证比例分毫不差。
能处理超长或超大图吗?
可以。宽高上限设为 20000 像素,足以覆盖绝大多数素材;若你的原图更大,理解「内接矩形」的方法论后也能自行套公式。