图片裁剪 — 自由比例、圆角圆形遮罩、批量裁剪，本地处理不上传

图片裁剪就是定一个框，把框外的部分去掉。先拖框：自由裁剪想多宽多高都行，也可以锁死 1:1、4:3、16:9、9:16、21:9 这些常用比例，还能自己填一组宽高当模板用。框拖好之后再加形状——圆角矩形的半径能按像素或百分比调，四个角还能分开设；圆形遮罩在正方形选区上给正圆，在矩形选区上给椭圆；多边形备了六边形、八边形和心形。这些形状只改显示和导出的轮廓，底下的裁剪区始终是矩形，导出时用 Canvas 再蒙一次，PNG 圆外自动透明，JPG 不支持透明所以会填上你选的底色。图片本身能转 90°、能拉任意角度把拍歪的照片扶正，也能水平垂直翻转。输出可以照选区的原始像素，也能强制成指定宽高，「禁止放大」开关保证原图不够大时不硬撑。改完能滑动对比、开放大镜检查圆角有没有锯齿，多张一起裁还能打包成 ZIP，顺手导出坐标 JSON 给后端二次处理。全程在浏览器里跑，图片不上传，手机、平板、电脑都能用。

导入图片

把图片拖到这里，或点击选择也可以直接按 Ctrl+V 粘贴截图支持 JPG / PNG / WebP / AVIF，具体看浏览器 · 单张上限 40.00 MB选择图片

裁剪画布

100%

导入图片后，在这里拖出裁剪框

拖动裁剪框移动，拖控制点改大小

裁剪结果

导入图片后，这里会显示裁剪结果

裁剪比例

自由

选固定比例后，拖控制点只会等比缩放；想随意拉就切回「自由」

形状遮罩

空白处填什么

选透明时导出 PNG / WebP / AVIF 才有意义；导出 JPG 会自动填白底或你选的底色

输出尺寸

禁止放大

原图像素不够时不硬撑，避免糊成一片

输出格式

质量92%

只对 JPEG / WebP / AVIF 生效，数值越高越清晰、体积越大

平滑档位

元数据已去除

导出时重新编码，相机型号、GPS、拍摄时间等 EXIF 信息不会带出去

文件名

前缀

后缀

可用 {w} 和 {h} 代表输出宽高

操作说明

把图片拖进上面的方框，或者点「选择图片」一次多选几张，也可以直接按 Ctrl+V 粘贴截图；要从网址取图就填进链接框。手机拍的照片会按 EXIF 自动摆正，不用先手动旋转。
在画布上拖出裁剪框，拖框内移动、拖八个控制点改大小。想锁比例就在右边点 1:1、16:9 之类的预设，或者填一组自定义宽高；想随意拉就切回「自由」。滚轮缩放整张图，空白处拖动平移，手机上双指捏合也一样。
按需要加遮罩：圆角矩形调半径（可四角分开）、圆形在正方形选区上给正圆、多边形可选六边形/八边形/心形。遮罩只改轮廓，导出时 PNG 圆外透明，JPG 会填你选的底色。
最后设输出尺寸、格式和质量，右边能滑动对比、按住看放大镜。满意就下载，多张就打包成 ZIP，还能顺手导出一份裁剪坐标 JSON 和 CSV 清单。

常见问题解答

加了圆角或圆形遮罩，导出后尺寸怎么还是矩形那么大？

因为遮罩不改变选区，它只是把选区外的像素变成透明。裁剪区始终是那个矩形，导出的宽高自然也是矩形的宽高。想要紧贴形状的尺寸，先把选区拉成正方形再套圆形遮罩；或者保留透明通道导出 PNG，让下游按 alpha 自己裁一遍。

选了圆形遮罩，导出 JPG 后四个角变成白块，是哪里设错了吗？

没有设错，是 JPG 本身不支持透明通道。圆外的像素必须落一个实在的颜色，默认填白，可以在「空白处填什么」里换成黑或自定义色值。真需要透明就导出 PNG、WebP 或 AVIF，这三种都带 alpha。

手机拍的照片导进来是躺倒的，要先自己转正吗？

不用。解码时会读照片里的 EXIF 方向标记直接摆正，之后的旋转、拉直都是在已经摆正的图上做，不会出现「转完又躺回去」。导出时这个方向标记会被丢掉，所以文件拿到别的软件里也不会再被转一次。

勾了「禁止放大」，为什么输出尺寸比我填的小？

这个开关的意思是原图像素不够时不硬撑。比如选区只有 300×200，你却要 1200×800，它会按 300×200 导出，而不是把图放大四倍糊成一片。确实需要强行放大，把它关掉即可。

批量裁剪时能只调其中一张吗？

能。比例、遮罩、圆角、输出格式和质量是所有图共用的，点列表里任意一行就切到那张，单独拖它的裁剪框，切走再切回来都还在。想让所有图重新按统一比例排一遍，点「恢复统一比例」。

概念

裁剪看起来只是「切掉不要的部分」，但它其实是两件事叠在一起：一件是选一块矩形区域，另一件是决定这块区域长什么形状。第一件很古老，暗房里用放大机的压边框把光挡住就行；第二件要等到像素能带透明度才成立。所以这个工具里所有的圆角、圆形、六边形、心形，本质上都不是「剪」出来的，而是在一张透明画布上「遮」出来的——先把矩形区域按比例重采样画满，再用一条路径当裁刀，只留下路径里面的像素。这也解释了一个常被误解的地方：遮罩不会改变底下的裁剪区，你看到的圆形只是矩形被蒙掉四个角，导出尺寸仍是那个矩形的宽高。JPEG 没有透明通道，所以选圆形又导出 JPG 时，圆外必须填一个实在的颜色，否则那些像素会被压成黑色。

历史与由来

在数字图像出现之前，裁剪是暗房里的一道手工活。放大机下面有一块叫压边框的金属框，把相纸压住，四条边往里推，推到哪里就只曝光到哪里——这就是最早的裁剪框，而且它有个今天很难体会的限制：你没法先看效果再决定，只能凭经验估。1950 年代起，报刊图片编辑开始在照片背面画上裁切标记，两条短线标出想保留的范围，摄影师拿回来照着裁，这套记号后来变成了印刷业通用的裁切线，也变成了 PDF 里那个 CropBox。1990 年 Photoshop 1.0 发布时，裁剪还只是一个很朴素的矩形工具：拉一个框，回车，框外直接丢掉，不可撤销之外没有别的选项。真正让裁剪变成「可反复调整」的是图层和非破坏性编辑的思路——1994 年 Photoshop 3.0 引入图层，1995 年的 4.0 加入调整图层，人们才开始习惯把原图留着、把裁剪当成一个随时能改的决定。圆角这件事走的是另一条线：1995 年 CSS 还只能画直角盒子，圆角要靠九宫格切图拼出来；2005 年 CSS3 草案提出 border-radius，2011 年前后各家浏览器才统一支持，圆角从此变成界面设计里最廉价也最泛滥的装饰。真正把「任意形状裁剪」变得随手可做的是两件事：1999 年 SVG 规范里的 clipPath，和 2004 年 HTML5 草案里补上的 canvas clip()。后者让人可以在浏览器里用一条贝塞尔路径当裁刀，把矩形画布切成心形或六边形，而这个工具导出的每一张圆角图，走的就是这条路。顺带一提，手机照片颠倒的老毛病在 1998 年 EXIF 标准里就写了解法——Orientation 字段——只是很多软件一直懒得读它，直到 2019 年前后浏览器才普遍在解码时自动摆正。