图片边框圆角

功能特性

• 支持实线、虚线、点线、双线四种边框样式与颜色、宽度设置。
• 支持统一圆角和四角独立圆角设置，适配头像、封面和卡片素材。
• 支持阴影偏移、模糊、扩展、颜色和透明度调节。
• 支持背景填充、PNG/JPG/WebP 导出与实时效果预览。

边框样式说明

• 实线：连续线条，适合通用内容展示与规范化排版。
• 虚线：节奏感更强，适合强调分区和流程型视觉。
• 点线：装饰感更突出，适合轻量化设计场景。
• 双线：层次更丰富，适合海报封面和重点展示图。

使用场景

• 社交媒体头像、封面图与内容配图统一风格
• 电商商品主图边框增强与视觉规范化处理
• 文档、课件、报告插图的圆角阴影批量处理
• 活动海报、作品集和运营素材的快速美化

常见问题

• 圆角值最大支持 250px，超出图片短边一半时会呈现圆形或椭圆效果。
• 导出尺寸可能大于原图，因为边框和阴影会扩展画布边界。
• 导出 PNG 可保留透明区域，导出 JPG/WebP 会使用不透明底色。
• 所有处理在本地浏览器执行，图片不会上传到服务器。

技术原理

• 使用 Canvas 路径绘制圆角矩形，实现统一或独立圆角形状。
• 使用 clip 裁剪图片区域，保证圆角边缘过渡自然。
• 使用 stroke 与 setLineDash 实现不同边框样式。
• 使用 shadowColor、shadowBlur 等属性生成阴影效果。

隐私说明

所有图片处理均在浏览器本地完成，不会上传图片或配置到服务器。