场景一:通勤路上改客户素材
地铁上收到「图标尺寸要 48 的」这类临时需求,直接打开 svg App 改宽高、导出,到站之前就能回消息。解决的是「需求来了但人不在电脑前」这个具体问题,结果是响应时间从几小时压到几分钟。
把矢量图这件事真正做顺手。svg App 是「svg图表」的移动端客户端,用来查看、编辑、预览与导出 SVG 矢量文件—— 在手机上改一段路径、调一组配色、对比两个版本,不必再等回到电脑前。
svg App 主画布 · 节点编辑与实时预览同屏
说功能清单谁都会写。我更想讲清楚:在哪些具体场合,它真的省了你的事。
我做过一段时间的电商详情页外包,最常遇到的状况是:客户在微信上甩来一个图标,说「这个颜色不对,换成品牌红」。 以前我得开电脑、打开编辑器、改色值、导出、再传回去,一来一回十几分钟。现在用 svg App 直接在手机上接收 SVG 文件, 点开对应的填充属性改掉色值,导出 PNG 回传,整个过程大概两分钟。这不是「效率提升 80%」那种漂亮话, 而是「你不用站起来去开电脑」这件具体的小事。
假设你手上有一个 24×24 的线性图标,描边是默认的 #333,客户要求换成品牌色 #B94040,并且要一张 256px 的 PNG 用在商品图上。
导入一段只含 stroke="#333333" 的 SVG 路径,画布尺寸 24×24,线条粗细 1.5。
在 svg App 里选中路径,把描边色值改为 #B94040,再把导出尺寸设为 256 像素。
得到一张 256×256 的透明背景 PNG,以及一份仍可继续编辑的 SVG 源文件,两份一起打包回传。
整个过程不需要联网、不需要上传到任何第三方服务器。改色是本地解析,导出是本地渲染—— 这一点对做客户素材的人来说很重要,源文件不出手机。
地铁上收到「图标尺寸要 48 的」这类临时需求,直接打开 svg App 改宽高、导出,到站之前就能回消息。解决的是「需求来了但人不在电脑前」这个具体问题,结果是响应时间从几小时压到几分钟。
设计稿交付前,用手机放大到 800% 检查路径有没有多余节点、圆角是否统一。很多细小的偏差在电脑上一眼扫过去就漏了,放大逐点看反而更容易发现,避免上线后被挑刺。
运营同事拿到 SVG 却不知道哪块能改,用 svg App 截一张带节点高亮的图发过去,圈出可编辑的属性位置。比写一段文字说明直观得多,对方照着改一次就懂了。
不堆形容词,只说每一项具体做什么、什么时候你会用到它。
放大到 800% 逐个拖动锚点,支持直线点与贝塞尔曲线点的类型切换。遇到「这个圆角看着别扭」的情况,能直接改控制柄,而不是重新画一遍。
色值以十六进制、RGB、HSL 三种方式同时呈现,改一个另外两个同步变。描边宽度、端点样式、虚线间隔都是可拖动的滑杆,改完画布实时刷新。
一次可以导出 SVG、PNG、PDF 三种格式,PNG 支持 1× 到 8× 的倍率。做 App 图标时经常一次要出 24、48、96、192 四套尺寸,这里能批量生成,不用一个个改。
所有路径解析与渲染都在设备本地完成,素材不上传云端。处理客户未公开的品牌图标时,这一点是硬性要求,也是我一直留着它的主要原因。
编辑过程中顶部会显示当前文件的字节数,删掉一个冗余节点立刻能看到体积下降。做性能敏感的项目时,这个数字比事后用工具压一遍更直观。
每次保存都会留一个快照,最多保留最近 30 个。改到一半发现方向错了,可以直接退回上一版,不用靠记忆重新描一遍。
下面几张是日常使用频率最高的界面,配的文字说明每屏具体在做什么。
分 Android 与 iOS 两组,按步骤走一遍基本不会卡住。遇到问题先看每组末尾的提示。
安装失败怎么办:先检查剩余存储空间是否大于 200 MB;如果仍失败,多半是安装包下载不完整,删掉重下一次即可,不建议从非官方渠道获取安装包。
如果下载按钮点了没反应:先确认网络是否正常,再检查系统时间是否自动同步。时间偏差过大会导致商店校验失败,这类问题占比不低。
下表只列我实际用过的几类方式,不做优劣评判,你按自己的场景对号入座。
| 对比项 | svg App | 桌面端编辑器 | 在线网页工具 |
|---|---|---|---|
| 节点级编辑 | 支持,可放大 800% | 支持,精度更高 | 多数仅支持整体缩放 |
| 离线可用 | 完全离线 | 完全离线 | 需要持续联网 |
| 素材是否上传 | 不上传,本地解析 | 不上传 | 通常会上传到服务器 |
| 批量导出多尺寸 | 支持 1× 至 8× | 需要插件或脚本 | 一般单张导出 |
| 启动成本 | 掏出手机即用 | 需要开电脑 | 打开浏览器即用 |
表格里的判断来自我个人的使用经验,不涉及任何第三方机构的评测数据。如果你更在意矢量运算的极限精度,桌面端仍然是更稳妥的选择; svg App 的定位是「随手能改」,不是「替代工作台」。
以前:开电脑、找文件、改、导、传,通常约 12 分钟。现在:手机上直接改,约 2 分钟。省下的是「起身开电脑」这段固定成本,改十次就省下一点五小时。
以前:把图标挨个导出再对尺寸,容易漏一个倍数。现在:导出时勾选多个倍率一次性生成,漏项的概率明显降低,验收返工次数少了。
以前:文字描述「第三个图标左上角那个圆角」对方听不懂。现在:截一张带节点高亮的图发过去,一次说清,来回确认的次数通常能从三四轮压到一轮。
按版本节点梳理,只看功能演进,不列奖项也不列无法核实的数字。
只做了三件事:打开 SVG、缩放查看、导出 PNG。功能少得可怜,但解析稳定性从第一版起就没出过大问题。
补上了路径锚点拖动与贝塞尔控制柄。这一版之后,它才算真正能「改图」而不只是「看图」。
把渲染流程整体搬到本地,取消了所有联网请求。素材不出设备这件事,从这一版开始成了默认行为。
支持一次导出 SVG、PNG、PDF,PNG 可选 1× 到 8× 倍率。做 App 图标的人反馈最多的就是这一项。
顶部实时显示文件字节数,同时加入最近 30 个版本快照。改坏了随时退回去,不用靠记忆重画。
围绕 svg 使用中真实会碰到的具体问题,不定期整理成专题。
把 viewBox 缺失、命名空间写法不规范、以及用了不支持的滤镜这三类原因逐个拆开讲。
从删冗余节点到合并同色路径,每种做法附上体积变化的前后对比。
按 24、32、48 三种画布尺寸分别给出建议值,并解释视网膜屏下的观感差异。
顺序错了会导致部分倍率下描边错位,这里讲清背后的渲染原因。
位图自动描摹的原理限制,以及哪些情况下应该重画而不是转换。
双指长按呼出节点菜单、三指下滑切换图层、边缘轻扫撤销,用过就回不去。
限时开放的内容整理与交流活动,状态会随进度更新。
连续七天每天重构一个旧图标,把过程截图发到交流区即可参与,结束统一整理成合集。
把 M、L、C、Q、A 这几类路径指令配上可交互示例,边看边在 svg App 里对着改一遍。
参与者提交一套自己的图标配色,由其他人重新配一版,互相说明改动理由。
每周三晚集中回答使用中遇到的具体问题,优先处理能复现的案例。
路径解析与渲染全部在本地完成,你的源文件不会经过我们的服务器。这一条从 2025 年 6 月的版本起就是默认行为。
反馈里只要能给出复现步骤和系统版本,我们优先处理。描述不清的问题会先回信追问,而不是直接挂起。
多人同时编辑同一份文件的协作功能,我们暂时不做。这需要账号体系与云端存储,与「素材不出设备」的定位冲突。
我们不提供任何盗版、破解或未授权素材的获取路径。如果你需要商用图标,请使用明确标注可商用的来源或自行绘制。
这里只放可自查的客观项。下载量、评分、用户数这类需要第三方统计口径的数字,我们不做估算也不做展示—— 没有可靠来源的数字写上去反而容易误导人。真实的使用感受,建议你自己装上试用十分钟再判断。
下面这些是反馈里出现频率最高的几个,答案尽量说到具体操作层面。
核心功能全部免费,包括节点编辑、多格式导出和离线解析,没有使用时长或导出次数限制。目前没有内购项目,也没有会员分级。将来如果加入云同步之类的增值功能,会明确标注哪些收费、哪些保持免费,不会把已有功能改成付费墙。
Android 需要 8.0 及以上,iOS 需要 14 及以上。低于这个版本装不上,不是我们故意限制,而是路径渲染用到的部分图形接口在更老的系统上不存在。如果你的设备刚好卡在门槛边缘,可以先装一个试试,打不开再卸掉就行,不会有残留。
不会上传。解析、渲染、导出全部在本地完成,App 在离线状态下也能正常使用全部编辑功能。App 只申请存储权限,用于读写你主动导入导出的文件,不涉及通讯录、位置或相机。如果哪天你发现它在没有操作的情况下产生网络流量,那属于异常,欢迎直接反馈给我们。
Android 端在 App 内的设置页有「检查更新」入口,也可以回本页重新下载覆盖安装;iOS 端通过 App Store 的更新列表升级。覆盖安装不会清空本地文件,但如果你的素材是放在系统临时目录里,建议升级前先导出到固定文件夹,避免系统清理临时文件时误删。
安装包约 38 MB,安装后占用通常在 90 MB 到 150 MB 之间,主要取决于你在 App 内保留了多少历史快照。单个 SVG 文件本身通常只有几 KB 到几十 KB。如果同时打开几十个复杂路径的文件确实会变慢,建议一次专注编辑一个文件,其余的关掉。
发邮件到页面底部的反馈邮箱,附上系统版本、App 版本号和复现步骤。如果能录一段屏幕操作,定位速度会快很多。工作日通常一到两天内有回复;如果描述里缺少复现条件,我们会先回信追问细节,这一步可能会多花一两天。
使用中遇到任何具体问题,或者想提功能建议,都可以直接写信给我们。写清楚系统版本和复现步骤,能省下不少来回确认的时间。
技术支持:support@svg-tu-biao.cn