点击上传 或 拖拽图片至此
图片圆角修剪工具完整使用指南
为图片加圆角蒙版并导出。上传后 canvas 预览；半径 #radiusSlider（显示 #radiusValDisplay），背景色 #bgColor，透明底 #transparentBg；预设可 updateActivePreset。handleFile 加载，render 按半径裁剪绘制。#downloadBtn 导出。适合头像、卡片缩略图、UI 素材，不是任意形状钢笔裁剪。
半径与背景
- 半径 0 近乎直角；过大接近胶囊/椭圆观感（视实现）。
- 透明底适合贴深色 UI；不透明底用 bgColor 填角外。
- 预设快速常用比例圆角。
- 导出 PNG 才能良好保留透明。
- 本地处理。
推荐步骤
- 上传正方形头像更易得均匀圆角或近似圆。
- 调半径到视觉舒适，避免切掉五官。
- 要透明角勾选透明；要白底卡片取消透明选白色。
- 下载插入设计稿，检查边缘锯齿（可 2× 导出若支持）。
- 批量需求重复操作或先统一尺寸再圆角。
边界
- 四角同一半径，无每角独立。
- 非圆形裁切专用「正圆头像」模式时，大半径矩形仍可能非正圆。
- 与圆角 CSS 不同：本页烘焙进像素。
- JPEG 导出会丢透明。
常见问题
角外是黑/白块？
未开透明或背景色设置如此，改 transparentBg/bgColor。
锯齿明显？
用更高分辨率原图；浏览器缩放预览可能误导。
能圆角视频吗？
仅图片。
和尺寸调整顺序？
先定尺寸再圆角，避免圆角后再缩放发糊。
设计提示
UI 规范常见 8/12/16px 半径，可按目标显示尺寸换算。品牌主图保持统一圆角语言。公共电脑用完关闭。
透明与底色
UI 贴图开透明；印刷小卡用白底。半径与显示尺寸匹配，预览缩放别误判。PNG 导出保透明。预设加快统一风格。
工作流
先缩放再圆角。头像建议近似正方形。与滤镜顺序：先调色再圆角更清晰。用完关闭页面。
补充说明 1
请结合本页真实按钮与输入操作：先上传或填写参数，再预览、下载、复制或清空。结果以界面为准。媒体处理均在本地浏览器完成，请勿在不信任设备打开机密文件；重要成品请及时保存副本。工具用于提升效率，不替代专业设计、视频剪辑或广告分析平台。
补充说明 2
请结合本页真实按钮与输入操作：先上传或填写参数，再预览、下载、复制或清空。结果以界面为准。媒体处理均在本地浏览器完成，请勿在不信任设备打开机密文件；重要成品请及时保存副本。工具用于提升效率，不替代专业设计、视频剪辑或广告分析平台。
补充说明 3
请结合本页真实按钮与输入操作：先上传或填写参数，再预览、下载、复制或清空。结果以界面为准。媒体处理均在本地浏览器完成，请勿在不信任设备打开机密文件；重要成品请及时保存副本。工具用于提升效率，不替代专业设计、视频剪辑或广告分析平台。