透明 PNG 常见问题通常来自 viewBox、隐藏背景层或边缘抗锯齿。按下面步骤做,返工会少很多。
1)导出前清理 SVG
- 确保 viewBox 正确,移除会撑大画布的隐藏路径。
- 删除不必要的白色背景矩形图层。
- 尽量让描边与像素网格对齐,降低边缘发虚概率。
2)设置导出参数
- 导出时选择透明背景并先看预览。
- 按目标场景选择 1x/2x/3x,避免后续再拉伸。
- 统一命名规则,便于设计和开发对齐资产。
3)上线前快速校验
- 分别在浅色/深色背景下查看,排查白边。
- 检查是否有边缘裁切,必要时加一点画布内边距。
- 核对导出尺寸是否与设计稿一致。