圆形裁剪
把任意图片裁成完美的圆——拖动选位、缩放取景，导出透明PNG或白底JPG
100% 浏览器本地处理，图片不会上传到任何服务器
如何把图片裁剪成圆形
步骤一
上传 JPG、PNG 或 WebP 图片。圆形选框默认居中出现——拖动框体移动位置，拖四角手柄缩放大小。
步骤二
选择输出尺寸（原尺寸 / 256 / 512 / 1024 / 自定义）和角部背景——做头像选透明 PNG，晒照片选白底 JPG；需要描边就打开圆形边框。
步骤三
点击「应用裁剪」生成圆形图片，再点「下载」保存。全程浏览器本地处理。
什么是圆形裁剪？
圆形裁剪（也叫裁圆、圆形抠图）就是把图片裁成圆形、去掉四个角的过程。结果通常用作头像、Logo 或徽章——在这些场合方形边框会显得突兀。
两种输出选项最关键：
- 透明 PNG——四个角完全透明，圆形可以"浮"在任何背景色上。这是大多数平台期望的头像格式。
- 白底 JPG——四角填充纯白。体积更小，但只适合放在白底版面上。
输出选 PNG 还是 JPG？
| 格式 | 四角 | 适合 | 取舍 |
|---|---|---|---|
| PNG （透明） | 完全透明 alpha | 有色背景上的头像、Logo、贴纸、图标 | 体积更大——alpha 通道仍然占字节 |
| JPG （白底） | 填充纯白 | 放在白底版面里的照片 | 体积更小；放在有色背景上会露白角 |
拿不准就用 PNG。透明 PNG 放任何背景上都成立，白角 JPG 只在白底上成立。
为什么要把图片裁成圆形？
圆形头像无处不在，因为圆形取景确实解决几个真实问题：
- 社交平台头像——微信、微博、小红书、抖音、QQ、Instagram、Twitter/X、Facebook、LinkedIn、Slack、Discord 和大多数论坛都以圆形展示头像。直接上传方图让平台自动"圆遮罩"，可能把你脸的重要部分裁掉；自己提前裁圆才能掌控取景。
- Logo 与品牌徽章——圆形 Logo 在紧凑的界面位置（favicon、App 图标、导航徽章）里比带白角的方形更干净。
- 聚焦主体——圆形天然把注意力集中到画面中央，遮掉四角的杂乱背景。
- 证件与肖像——工牌、学生证、会员卡的证件照有时要求圆形相框。
- 贴纸和表情——iMessage 贴纸、WhatsApp 贴纸、Discord 表情通常都是圆形或圆角方形。
各平台常见头像尺寸
不同平台展示头像的尺寸不同，但大多接受较大尺寸自行缩小。推荐输出尺寸：
| 平台 | 建议上传 | 展示尺寸 |
|---|---|---|
| 微信 | 512 × 512 px | 圆形展示，原图保留 |
| 640 × 640 px | 圆形展示 | |
| 微博 | 500 × 500 px | 圆形展示 |
| 小红书 | 500 × 500 px | 圆形展示 |
| 抖音 | 400 × 400 px | 圆形展示 |
| 320 × 320 px | 320 × 320（主页），150 × 150（评论） | |
| Twitter / X | 400 × 400 px | 400 × 400（主页） |
| 320 × 320 px | 170 × 170（主页），128 × 128（评论） | |
| 400 × 400 px | 400 × 400（主页） | |
| Discord | 1024 × 1024 px（推荐） | 最小 128 × 128 |
| 500 × 500 px | 500 × 500 |
想要一个尺寸走天下，选512 × 512 px——视网膜屏上够锐利、以上所有平台都接受、体积也小到手机秒传。
圆形裁剪的工作原理
幕后是画布裁剪（clip）操作：
- 把图片读入指定输出尺寸的正方形
<canvas>（原尺寸 / 256 / 512 / 1024 px） - JPG 输出时先用纯白填充画布，避免四角变黑
- 绘制路径设为铺满整个正方形画布的圆（
ctx.ellipse(cx, cy, r, r, ...)） - 把绘制裁剪到这个圆内（
ctx.clip()） - 在裁剪区域内绘制原图，把屏幕上圆框的包围盒（原图坐标）映射到输出画布
- 通过
canvas.toBlob()导出为 PNG（保留透明四角）或 JPG（白四角，更小）
整个操作在浏览器本地运行，图片不经过任何服务器。
在各种设备上怎么裁圆
最快——直接用本页
在上方上传，拖动圆框定位、拖角缩放，然后应用 + 下载。无需装软件、无需注册。
Adobe Photoshop（Mac / Windows）
- 打开图片，选椭圆选框工具（M，再按 Shift+M 从矩形切换）
- 拖动时按住 Shift 锁定正圆
- 选择 → 反选，按 Delete 删除圆外部分
- 存为 PNG 保留透明四角
GIMP（免费，Mac / Windows / Linux）
- 椭圆选择工具，按住 Shift 锁定正圆
- 选择 → 反转
- 编辑 → 清除
- 图层 → 透明度 → 添加 Alpha 通道（如尚无），导出为 PNG
iPhone 和 iPad（iOS）
系统照片 App 不支持圆形裁剪。用本工具，或 Canva、Adobe Express 手机版等第三方 App。
Android
同 iOS——Google 相册和多数手机自带相册都没有圆形裁剪。用本工具或第三方 App。
Canva（网页版）
上传图片，从元素面板拖一个圆形相框，把图片填进去。Canva 免费版就含基础圆形相框。
常见问题
JPG 输出能有透明四角吗？
不能。JPG 不支持透明——像素以完全不透明的 RGB 编码。想要透明四角必须导出 PNG；JPG 输出会用纯白填充四角。
圆形头像一般做多大？
通用头像场景，512 × 512 像素是最佳点——高分屏上够锐、主流平台全接受、体积小上传快。微信、微博、Instagram、LinkedIn 从这个尺寸缩小都很干净。
圆形裁剪和圆角矩形有什么区别？
圆形裁剪把图片裁成完整的圆，四个角彻底去掉（输出是透明或白底上的圆）；圆角矩形保留矩形图片、只是用 CSS border-radius 把角磨圆。圆裁的输出是真圆，圆角的输出仍是矩形。
圆形裁剪会减小文件体积吗？
透明四角的 PNG 体积和原图差不多——透明像素仍然占字节（alpha 通道存储）。白底 JPG 通常更小，因为纯白的四角像素压缩效率极高（没有细节要编码）。
为什么我的圆图有锯齿/发虚？
多半是源图较小、输出尺寸较大。选原尺寸输出匹配源分辨率；需要更大的特定输出（如 1024 px）时，请从更高分辨率的照片开始，圆形裁剪才有足够的源像素可画。
导出的文件四角为什么是黑的而不是透明的？
你导出成了 JPG。JPG 不支持透明——画布默认是透明黑，绘制前我们会先把四角涂白。看到黑色说明走了异常路径；请改选 PNG 获得真透明，或确认选的是 JPG / 白底选项。
