图片工具 · 编辑变换

头像剪裁

圆形/多边形/自定义形状

本地处理 · 不上传 免费 · 无需登录 无次数限制 累计 55 次使用
圆形 · 多边形 · 心形 · 取景平移 · 描边 · 本地
拖入 / 点击 / 粘贴照片,做头像

支持 JPG · PNG · WebP · GIF · BMP · AVIF · 单张 ≤ 50MB
截图直接 CtrlV 粘贴

Cropped locally — nothing uploaded
就绪 · 拖入或粘贴照片开始制作头像
第一节

关于本工具

About

社交媒体头像总差那么一点:方框裁掉了发梢,圆框又框不住帽子。这个工具直接对图片画圆形、多边形或自由形状选区,框内保留、框外裁掉,不缩放不拉伸。裁剪结果即时预览,不满意可重画选区——整个过程在浏览器本地处理,图片不会上传到任何服务器。

使用场景

简历照片换底色

准备投递一家设计公司,对方要求简历照片为纯白色背景,而手头只有一张在咖啡馆拍的暖黄底生活照。用 PS 抠图太耗时,且边缘处理不好会留下白边。本工具支持多边形裁剪,可以沿着头发丝和肩膀轮廓手动描点,生成一张边缘干净、背景透明的 PNG 图,再导出为白底 JPG。整个过程在浏览器内完成,照片不会上传到任何服务器。

社群头像统一风格

小区业主群有 137 人,群主想让大家换上统一的圆形头像,但群里大多是中老年人,不会用修图软件。群主把大家的原始图片收齐后,用本工具的圆形裁剪功能批量处理。设置裁剪直径为 400 像素,输出时自动居中并填充白色圆角背景。每张图处理耗时不到 2 秒,发回群里后大家直接保存替换,群聊界面瞬间变得整齐。

淘宝商品图去水印

从供货商拿到的产品图右下角有红色水印,直接上架会被平台判定为图片质量不合格。用常规橡皮擦工具会留下模糊的色块。本工具的自定义形状裁剪可以沿着水印边缘画一个不规则多边形,将水印区域整体切掉,再生成一张新的透明底图。之后在详情页里用白色背景覆盖即可,比手动涂抹节省 10 分钟。

证件照裁切标准尺寸

报名参加一个线上考试,系统要求上传 1 寸白底证件照,像素为 295×413。手机拍的原图是 1920×1080,直接上传会被系统自动拉伸变形。本工具提供固定比例裁剪功能,锁定 295:413 的宽高比后,拖动选框框住头部区域,裁剪后自动缩放到目标像素。输出的图片大小控制在 80KB 以内,符合报名系统的上传限制。

第二节

使用指南

Getting Started

使用步骤

  1. 1上传头像图片后,画布上出现可拖拽的圆形选区,默认居中覆盖主体
  2. 2拖拽选区边缘的锚点调整圆形大小,或拖拽选区内部平移位置,预览区实时更新裁剪结果
  3. 3点击「多边形」模式,在图片上依次点击顶点生成自定义形状,闭合后预览区显示多边形裁剪效果
  4. 4点击「自定义形状」模式,用鼠标在图片上绘制任意闭合路径,路径闭合后预览区即时渲染裁剪结果
  5. 5点击「下载」按钮,浏览器自动保存裁剪后的 PNG 图片,文件名包含当前形状类型标记

输入输出示例

输入输出说明
上传一张 800×800 像素的正面半身照,选择「圆形」剪裁,输出尺寸设为 200×200 像素生成一张 200×200 像素的圆形头像,背景透明,人物面部居中,圆形区域外全部裁掉常规:正方形原图 + 圆形剪裁是最常见场景,验证工具能否正确处理等比例缩放和居中裁切
上传一张 1920×1080 像素的风景横图,选择「圆形」剪裁,输出尺寸设为 500×500 像素生成一张 500×500 像素的圆形头像,以图片中心为圆心裁取最大内接圆,左右两侧被裁掉常规:矩形原图(非正方形)时,工具需自动以短边为直径裁取内接圆,验证裁切逻辑
上传一张 50×50 像素的小图标,选择「圆形」剪裁,输出尺寸设为 200×200 像素生成一张 200×200 像素的圆形头像,原图被放大 4 倍后裁切,可能出现像素模糊或锯齿边界:输入图片远小于输出尺寸,验证工具是否做插值放大及放大后的画质表现
上传一张 10000×10000 像素的超大尺寸照片,选择「自定义形状」剪裁,上传一个 SVG 五角星路径生成一张 10000×10000 像素的五角星形状头像,处理时间约 2-3 秒边界:超大尺寸图片 + 复杂矢量路径,验证工具的内存管理和处理速度是否稳定
上传一张 300×300 像素的图片,选择「多边形」剪裁,顶点坐标设为 [(0,0), (300,0), (300,300), (0,300)]生成一张 300×300 像素的矩形头像,与「不剪裁」效果完全相同边界:多边形顶点恰好覆盖整张图片,验证工具能否正确处理「剪裁区域等于原图」的退化情况
上传一张 400×400 像素的图片,选择「圆形」剪裁,输出尺寸设为 400×400 像素,但上传的图片文件格式为 .webp生成一张 400×400 像素的圆形头像,输出格式为 PNG(默认透明背景格式)易错:输入格式为 WebP,但输出圆形头像需要透明通道,验证工具是否能自动转换输出格式为支持透明的 PNG
上传一张 100×100 像素的图片,选择「自定义形状」剪裁,上传一个包含 2000 个控制点的复杂贝塞尔曲线 SVG生成一张 100×100 像素的复杂形状头像,处理时间约 5-8 秒易错:自定义形状路径过于复杂(大量控制点),验证工具对复杂矢量路径的解析和渲染性能

常见错误对照

1.上传图片分辨率过低,裁剪后头像模糊

✗ 错误上传 48×48 像素的小图,裁剪成 200×200 头像
✓ 修复上传至少 400×400 像素的原图再裁剪

裁剪不会增加像素,原图分辨率低于目标尺寸时,放大必然模糊。建议原图边长至少为目标的两倍。

2.圆形裁剪时,选区未完全覆盖面部

✗ 错误圆形选区只框住半边脸,另一半被切掉
✓ 修复拖动圆形选区,确保面部中心位于圆心,边缘留出 10% 余量

圆形裁剪会切除选区外的所有内容,面部被切割后无法恢复,预览时务必确认五官完整。

3.多边形裁剪时,顶点顺序混乱导致形状扭曲

✗ 错误想裁一个五边形,但点击顶点时顺序为 1→3→5→2→4
✓ 修复按顺时针或逆时针顺序依次点击顶点:1→2→3→4→5

多边形裁剪按顶点连接顺序生成闭合区域,乱序会产生交叉边或凹陷形状,与预期不符。

4.自定义形状使用透明 PNG 蒙版时,未将非透明区域对齐主体

✗ 错误蒙版是一颗心形,但心形偏左,导致头像主体被切掉一半
✓ 修复在蒙版中,将心形非透明区域居中放置,并留出边距

自定义形状裁剪以蒙版非透明区域为选区,蒙版内容偏移会直接导致最终头像内容偏移。

5.保存时选择 JPG 格式,透明背景变白块

✗ 错误圆形头像保存为 .jpg,期望背景透明
✓ 修复保存为 .png 格式,保留透明背景

JPG 不支持 alpha 通道,透明区域会被填充为白色。需要透明背景必须选 PNG。

6.裁剪前未旋转图片,导致人物倾斜

✗ 错误原图人物歪了 15°,直接裁剪后头像也是歪的
✓ 修复先使用工具的旋转功能将人物摆正,再裁剪

裁剪只做选区切割,不修正旋转。倾斜的人物在头像中会显得不自然,需提前校正。

7.多边形裁剪时,顶点数量过少导致细节丢失

✗ 错误想裁出复杂轮廓(如发丝),只用 4 个顶点
✓ 修复沿轮廓密集放置顶点(至少 20 个以上)

多边形裁剪是直线连接顶点,顶点越少,曲线越粗糙。复杂边缘需要更多顶点逼近真实轮廓。

第三节

工作原理

How It Works

核心公式

mask(x,y) = 1 if (x - cx)² + (y - cy)² ≤ r² else 0

变量说明

  • x, y像素坐标,原点在图像左上角
  • cx, cy圆心坐标,即剪裁中心点
  • r圆形半径,单位像素
  • mask(x,y)1 保留该像素,0 透明化

示例

原图 400×400,圆心 (200,200),半径 150。像素 (100,100):(100-200)²+(100-200)²=10000+10000=20000,r²=22500,20000≤22500 → 保留。像素 (50,50):(50-200)²+(50-200)²=22500+22500=45000>22500 → 透明。最终输出圆形头像。

上传原图选择裁剪形状圆形 / 多边形 / 自定义浏览器内裁剪Canvas 实时运算导出调整裁剪区域拖动 / 缩放 / 旋转
用户输入 本地处理 输出结果
第五节

常见问题

Q & A
上传的图片不是正方形,剪裁后会不会变形?

不会变形。本工具剪裁时只保留所选区域(圆形/多边形/自定义),不拉伸图片。如果上传的是长方形图片,剪裁区域默认以短边为直径生成圆形,多余部分自动裁掉;自定义形状时也可手动框选任意矩形区域,最终输出保持原图比例,不会出现压扁或拉长。建议提前用其他工具把图片裁成1:1,这样圆形剪裁能保留更多内容。

为什么我画的多边形剪出来边缘有锯齿?

锯齿通常出现在两点:一是你画的多边形顶点间距太短,产生锐角导致边缘不平滑;二是原图分辨率偏低,放大后像素颗粒感明显。本工具剪裁时使用抗锯齿算法处理边缘,但如果原图低于200×200像素,锯齿仍可能可见。建议上传至少500×500像素的图片,画多边形时尽量让顶点均匀分布,避免长细尖角。

剪裁后保存的图片背景是白色,能改成透明吗?

可以。本工具默认输出为PNG格式,圆形和多边形剪裁后背景自动透明;自定义形状剪裁时,如果框选区域外有空白,也会保持透明。如果你保存时发现背景是白色,请检查浏览器是否把PNG自动转成了JPG(部分浏览器下载时默认选JPG),手动选择「PNG」格式即可保留透明通道。

剪裁时能不能同时旋转图片方向?

本工具目前不支持旋转功能。如果需要旋转,建议在上传前先用系统相册或图片编辑器旋转好方向。剪裁框本身只能调整大小和位置,不能旋转角度。如果图片本身是横着的,可以先旋转再上传,这样剪裁时就能对准人脸或主体。未来可能会考虑加入旋转功能。

上传的图片会不会被存到你们服务器上?

不会。本工具完全在浏览器本地运行(FE实现),你上传的图片只存在于当前页面的内存中,不会发送到任何服务器。剪裁完成后,图片由你的浏览器直接生成下载链接,整个过程不经过后端。关闭页面后,内存中的图片数据自动释放,没有任何副本留存。可以放心处理包含个人信息的头像。

剪裁后图片大小(KB)比原图大了很多,正常吗?

正常。如果你剪裁后保存为PNG格式,且原图是JPG(有损压缩),PNG是无损格式,文件体积通常会变大。例如一张200KB的JPG剪裁成圆形后保存为PNG,可能变成500KB-1MB。如果希望文件小一些,保存时选择JPG格式(会损失透明背景),或者用其他工具压缩一下。本工具不提供压缩选项。

手机浏览器上能正常剪裁吗?

可以。本工具适配了移动端,在手机浏览器(Chrome、Safari、UC等)上同样支持圆形、多边形和自定义形状剪裁。操作时用手指拖动剪裁框调整位置,双指缩放图片。注意部分旧版浏览器(如iOS 12以下Safari)对Canvas支持有限,剪裁大图(超过4000×4000像素)可能卡顿或闪退,建议在电脑上处理高分辨率图片。

剪裁圆形头像时,能不能精确控制直径像素?

不能手动输入直径数值。本工具通过拖动剪裁框的边角来调整大小,圆形剪裁框的直径由框的宽度决定,框的像素尺寸会实时显示在图片上方(如「当前选区:240×240」)。如果需要精确到某个像素值,建议先用其他工具把图片缩放到目标尺寸,再上传剪裁。例如想要200×200的圆形头像,先准备200×200的正方形图片。

为什么剪裁后图片边缘有一圈白边?

白边通常是因为剪裁框没有完全贴合图片边缘,或者图片本身有白色背景且剪裁区域包含了背景。如果是圆形剪裁,白边可能来自剪裁框外的原图背景;如果是自定义形状,框选时多选了空白区域。建议剪裁前先把图片放大到剪裁框刚好覆盖主体,或者用「多边形」模式沿着主体边缘描边,避免包含背景色。

可以批量剪裁多张图片吗?

目前不支持批量处理。本工具每次只能上传一张图片进行剪裁,适合单张头像或单张图片的精细调整。如果需要批量剪裁(比如一次处理几十张头像),建议使用桌面端的图片处理软件(如Photoshop动作、FastStone Photo Resizer)。后续可能会根据用户需求考虑增加批量功能。

隐私保证所有计算与处理均在你的浏览器本地完成,输入数据不会上传服务器,也不会保存或共享。

选择 打开 +新窗口 esc关闭