SVG 二维码生成器 - 下载用于印刷和网页的矢量二维码
使用 QR-Build 的 svg qr code generator 创建可缩放的矢量二维码,适用于印刷版式、包装、标牌、设计软件和网页内联嵌入。生成 URL、vCard、WiFi、PDF、邮件或产品二维码,然后下载可用于生产流程的 SVG 输出。
网站
| 我需要... | 最佳做法 |
|---|---|
| 用于一次性静态印刷任务的 SVG | 创建静态二维码,并下载 SVG 文件放入版式。 |
| 用于季节性活动且 URL 可能变化的 SVG | 使用带可编辑重定向的动态二维码,这样已印刷的 SVG 不需要更换。 |
| 带 logo、用于包装的 SVG | 使用 logo 自定义和更高的纠错级别,并在印刷审批前测试最终 artwork。 |
| 用于产品变体的批量 SVG 二维码 | 查看当前计划,确认批量流程和动态目标管理。 |
| 用于网页内联嵌入的 SVG | 在需要 CSS 控制时,下载或复制 SVG 源码并直接嵌入 HTML。 |
什么是 SVG 二维码?
QR-Build 是 qr-build.com 上的网页二维码生成器,可为 URL、vCards、WiFi 网络、PDF 链接、邮件、产品和其他支持的内容类型创建二维码。SVG 导出是输出格式,不是二维码内容类型,因此可以先选择二维码类型,再将结果下载为矢量文件。
当二维码会在导出后调整大小时,SVG 很重要。PNG、JPG 和 BMP 是具有固定像素尺寸的栅格格式,低分辨率 PNG 在 Illustrator、InDesign 或大幅印刷版式中放大时可能变模糊。SVG 和 EPS 是矢量格式,因此模块在任何输出尺寸下都保持数学意义上的清晰。
干净的 SVG 二维码本身并不会自动改善扫描效果。可扫描性取决于对比度、静区、印刷尺寸和纠错。格式保护视觉清晰度;二维码结构和最终 artwork 仍需在生产前测试。
矢量输出
SVG 使用路径数据而不是像素,因此二维码可以缩放而无需重新采样,也不会模糊。
适合印刷流程
设计师可以在 Illustrator、Figma、InDesign、包装文件和标牌版式中放置 SVG 二维码。
适合网页流程
开发者可以将 SVG 作为图像文件使用,或把标记内联粘贴以实现 CSS 控制的响应式嵌入。
SVG、PNG 还是 EPS - 应该下载哪种格式?
格式选择应跟随最终放置场景。SVG 通常是现代设计和网页流程中最佳的二维码矢量格式,PNG 仍是固定尺寸数字图像最简单的选择,而当印刷供应商要求 PostScript 印前流程时,EPS 仍然相关。
| 格式 | 最适合 | 分辨率 | 文件大小 | 软件支持 |
|---|---|---|---|---|
| SVG | 现代印刷、网页、品牌、包装、响应式嵌入 | 不依赖分辨率的矢量 | 小到中等 | 浏览器、Illustrator、Figma、InDesign、Sketch、Inkscape、Affinity Designer |
| PNG | 仅数字图像、邮件正文图片、社交帖子、演示幻灯片 | 固定栅格像素 | 中等 | 几乎所有应用都通用支持 |
| EPS | 专业印前、胶印、旧式 PostScript RIP 系统 | 不依赖分辨率的矢量 | 通常大于 SVG | Illustrator、InDesign、CorelDraw 和印刷供应商的印前工具 |
此比较基于 QR-Build 截至 2026 年对 Illustrator CC、Figma、InDesign、现代浏览器和常见印刷交付场景中 SVG、PNG、EPS 流程的评估。
| 条件 | 格式建议 |
|---|---|
| 二维码将在印刷版式中调整大小 | 使用 SVG,让模块在最终输出尺寸下保持清晰。 |
| 二维码只用于固定尺寸的邮件图片 | 使用 PNG,因为它简单、广泛接受,并且足以满足纯栅格放置。 |
| 印刷供应商要求 PostScript 兼容文件 | 使用 EPS,或确认供应商可以通过其特定印前系统转换 SVG。 |
| 二维码目标可能在印刷后改变 | 使用带动态二维码的 SVG 输出,让矢量文件保持不变,同时重定向目标可编辑。 |
如何用 QR-Build 生成 SVG 二维码
- 1
第 1 步 - 选择二维码类型
从内容类型开始:URL、vCard、WiFi、PDF 链接、邮件、活动、产品或其他支持的二维码类别。如果不确定哪种载荷类型合适,可参考选择二维码类型。
- 2
第 2 步 - 输入内容
添加目标 URL、联系人数据、WiFi 凭据、文档链接或活动载荷。对于印刷活动,在选择静态二维码前确认 URL 已最终确定。
- 3
第 3 步 - 自定义设计
只有在载荷正确后,才调整颜色、logo、边框或形状。如果品牌样式是主要任务,请了解如何自定义二维码设计而不牺牲扫描可靠性。
- 4
第 4 步 - 下载为 SVG
选择 SVG 作为导出格式,并将文件放入 Illustrator、Figma、InDesign、网页组件或可印刷包中。在发布或批准印刷前,对已放置的 artwork 进行扫描测试。
让已印刷的 SVG 二维码可更新
动态二维码允许已印刷的 SVG 保持原位,同时通过 QR-Build 的重定向层更改目标 URL。适用于菜单、季节性包装、活动物料和长版印刷活动。
在设计软件中使用 SVG 二维码
Adobe Illustrator
Adobe Illustrator 是矢量设计软件,可原生导入 SVG 并支持路径编辑。放置 SVG,如需模块级访问可使用 Object > Ungroup,无损调整大小,并在印刷导出前将文档颜色模式切换为 CMYK。
Figma
Figma 是基于浏览器的设计工具,可通过剪贴板粘贴或文件导入接受 SVG。QR-Build SVG 可以变成组件,在界面版式中缩放,并在高密度屏幕上保持清晰。
Adobe InDesign
Adobe InDesign 是页面版式软件,可将 SVG 作为链接或嵌入资源放置。适配框架时要保留静区,因为裁掉空白边缘是印刷二维码失效的常见原因。
Canva
Canva 是网页设计工具,可以将 SVG 作为上传元素使用,但 SVG 上传可用性可能取决于当前计划。在向客户承诺可编辑矢量交付前,请验证 Canva 账号中的 SVG 支持。
CorelDraw
CorelDraw 是用于标牌制作和大幅印刷流程的矢量图形软件。它可以打开 SVG 和 EPS,但印刷厂应在大批量生产前确认供应商特定的 RIP 行为。
Inkscape and Affinity Designer
Inkscape 和 Affinity Designer 都将 SVG 作为原生矢量格式处理。它们适合需要检查路径数据或为客户交付转换资源的自由职业者。
在网页上嵌入 SVG 二维码
内联嵌入是指把 SVG 标记直接插入 HTML,可实现 CSS 控制并避免额外 HTTP 请求。文件嵌入是指将 SVG 作为图像资源提供,当设计师和开发者共享文件时更易管理。
| 方法 | 最适合 | 实现 |
|---|---|---|
| Inline SVG | 网页组件、响应式版式、CSS 尺寸控制、无额外请求 | 将 SVG 标记粘贴到 HTML,并添加 role 和 aria-label 属性。 |
| 图像文件 | 简单页面、CMS 上传、文档、静态资源流水线 | 使用带描述性 alt 属性的 img 元素,并用 CSS 控制显示尺寸。 |
| 下载链接 | 开发交接或用户可访问的二维码资源下载 | 使用正确的 image/svg+xml 内容类型提供 SVG 文件。 |
<svg role="img" aria-label="链接到活动落地页的二维码" viewBox="0 0 256 256">...</svg>
<img src="/assets/campaign-qr.svg" alt="链接到活动落地页的二维码"> 用于印刷和包装的 SVG 二维码
SVG 导出适合印刷链路:SVG 导出生成矢量路径,矢量路径不依赖分辨率,静区可在版式软件中保留,并且在对比度和尺寸正确时二维码仍可扫描。进行尺寸规划时,请将印刷二维码尺寸指南与供应商生产规格一起使用。
包装设计师
产品标签需要一个打开保修页面的二维码,并且必须在 Illustrator 中放置且没有栅格模糊。
SVG 保持模块边缘清晰,并让设计师按标签限制缩放资源。
印刷店操作员
客户为展会横幅提供低分辨率 PNG,但最终输出宽度超过 1 米。
只要静区和对比度保持完整,矢量二维码就能无损缩放到大幅格式。
营销代理机构
季节性活动使用海报、桌牌和直邮,并指向一个可能变化的二维码目标。
动态 SVG 二维码输出将印刷物料连接到可编辑的重定向 URL,并降低重印风险。
自由设计工作室
客户要求最终品牌资源中包含二维码矢量文件,用于未来名片和办公用品。
SVG 提供可复用交付物,可放入未来的印刷和数字模板。
静态与动态 SVG 二维码
静态二维码在生成时将目标永久编码进图案。动态二维码使用重定向层,这是一种服务器端中介,会把扫描流量从固定短 URL 转发到当前目标 URL。更深入的比较请参阅用于印刷活动的静态与动态二维码,以及团队如何用二维码分析跟踪扫描。
| 标准 | 静态 SVG 二维码 | 动态 SVG 二维码 |
|---|---|---|
| 目标可编辑性 | 目标在生成后固定。 | 可在仪表板中更新目标,而无需更改已印刷的 SVG。 |
| 分析 | 除非目标系统跟踪访问,否则没有内置扫描分析。 | 扫描分析可将二维码表现连接到活动 ROI。 |
| 重印风险 | 当 URL、菜单、表单或活动页面可能变化时风险更高。 | 风险更低,因为重定向目标可在印刷后编辑。 |
| 最佳用途 | 一次性印刷品、固定目标、简单网页嵌入。 | 季节性活动、包装、菜单、活动物料和长版印刷。 |
SVG 二维码的常见错误
裁掉静区
静区是扫描器用来定位二维码的空白边框。将 SVG 放入框架或版式后,四周至少保留 4 个模块宽度。
过度压缩路径
激进的 SVG 优化可能合并、简化或改变路径,从而破坏模块几何。生产使用前请验证优化后的文件。
使用低对比度颜色
即使 SVG 完全清晰,低对比度背景上的浅色模块也可能扫描失败。除非测试证明可行,否则使用浅色背景上的深色模块。
把 SVG 当作自动扫描改进
SVG 防止像素化,但不能弥补尺寸过小、对比度差、静区损坏或纠错不足。
将 EPS 当作变通方案
当供应商要求 EPS 时它很有用,但现代工具通常可以直接处理 SVG。除非印刷流程需要,否则避免不必要的转换。
跳过供应商确认
一些专业印刷厂仍要求 EPS 以兼容 PostScript RIP 流程。最终交付前请确认要求。
SVG 二维码下载最佳实践
自定义后进行扫描测试
添加 logo、重新着色模块、放到背景上或导出最终 artwork 后,都要测试二维码。
为 logo 使用更高纠错
当 logo 或设计元素覆盖部分二维码图案时,纠错级别 Q 和 H 提供更高恢复能力。
保留动态备份
对于菜单、活动、包装和季节性活动,若 URL 变化会导致重印,请使用动态二维码。
用版本命名文件
使用 brand-qr-v2.svg 这样的可预测命名,让设计师、客户和印刷方知道哪个文件已获批准。
保留源文件和已放置文件
将原始 SVG 与最终设计文件放在一起,这样无需重建整个版式即可检查或替换二维码。
确认当前价格
动态二维码功能和计划限制可能变化。在承诺付费流程假设前,请使用查看当前计划。
技术规格
QR-Build 的 SVG 导出生成干净的路径输出,而不是把栅格化 PNG 包在 SVG 容器中。文件以有效 SVG 标记导出。纠错默认值和选项取决于所选二维码流程;L、M、Q 和 H 级别分别约对应 7%、15%、25% 和 30% 的恢复能力。对于嵌入 logo 的设计,我们建议使用 Q 或 H,并在印刷审批前进行扫描测试。
| 区域 | 规格 | 生产说明 |
|---|---|---|
| 文件格式 | SVG、PNG 和面向 EPS 的印刷交接流程 | 现代矢量输出使用 SVG;向印刷供应商确认 EPS 要求。 |
| 静区 | 四周最少 4 个模块宽度 | 将 SVG 放入版式框架时不要裁掉空白边框。 |
| 纠错 | L 7%、M 15%、Q 25%、H 30% | 添加 logo 或印刷条件不够可预测时使用 Q 或 H。 |
| DPI | 不适用于 SVG,因为 SVG 不依赖分辨率 | DPI 对栅格导出和最终印刷生产重要,但不适用于矢量源文件。 |
| URL 载荷 | 较短 URL 会生成密度较低的二维码图案 | 动态二维码重定向可在保持目标可编辑的同时,让印刷图案更紧凑。 |
| 工具 | SVG 支持 | 注意事项 |
|---|---|---|
| 现代浏览器 | 截至 2026 年原生渲染 SVG | Chrome、Firefox、Safari 或 Edge 中的 Inline SVG 不需要插件或 polyfill。 |
| Adobe Illustrator CC | 2024 年及以后版本原生导入 SVG | 印刷输出使用 CMYK 文档模式,并在重新着色后测试。 |
| Figma | 剪贴板粘贴和文件导入 | 导入的 SVG 可成为组件或可编辑矢量组。 |
| Adobe InDesign | 在版式文档中放置 SVG | 确认框架没有裁掉静区。 |
| Canva | SVG 上传可能取决于计划 | 客户交付前验证当前账号支持。 |
| 旧式印刷 RIP 系统 | 可能要求 EPS 而不是 SVG | 大批量印刷前询问供应商需要哪种矢量格式。 |
术语表
SVG
SVG,即 Scalable Vector Graphics,是一种基于 XML 的矢量图像格式,将图形编码为路径,并可在不像素化的情况下缩放。
EPS
EPS,即 Encapsulated PostScript,是用于专业印前流程和旧式 RIP 系统的矢量格式。
矢量
矢量图像由数学路径定义,因此可以无限缩放而不损失边缘清晰度。
栅格
栅格图像由固定像素组成,因此放大超过原始尺寸时质量会下降。
DPI
DPI,即每英寸点数,用于衡量印刷分辨率;它不适用于 SVG 源文件,因为 SVG 不依赖分辨率。
静区
静区是二维码周围的空白边框,扫描器用它定位图案;建议至少 4 个模块宽度。
纠错
纠错是二维码的数据冗余,使图案部分被遮挡时仍可扫描;L、M、Q、H 级别提供递增的恢复能力。
内联嵌入
内联嵌入是指将 SVG 标记直接放入 HTML,使 CSS 可以控制二维码而无需加载单独图像文件。
动态二维码
动态二维码使用重定向层,使目标 URL 可在二维码印刷后更新。
重定向层
重定向层是服务器端中介,将扫描流量从固定短 URL 转发到当前目标 URL。
干净 SVG 输出
干净 SVG 输出是没有嵌入栅格图像的矢量路径数据,可在设计软件中可靠缩放和检查。
常见问题 - SVG 二维码生成器
什么是 SVG 二维码?
SVG 二维码是导出为 Scalable Vector Graphics 文件的二维码,这种格式由数学路径构成,可缩放到任意尺寸而不发生像素化。不同于 PNG 或 JPG,SVG 不依赖分辨率,在任何输出尺寸下都保持清晰。QR-Build 可为 URL、vCards、WiFi 网络、PDF 和所有其他支持的内容类型生成 SVG 二维码。
SVG 是二维码的最佳格式吗?
当二维码用于印刷、大幅输出、包装或需要响应式缩放的网页内联嵌入时,SVG 是最佳格式。对于社交媒体图片、邮件正文内容或演示幻灯片等仅数字场景,PNG 更简单且同样有效。请根据二维码的展示位置和方式选择格式。
QR-Build 的 SVG 二维码生成免费吗?
QR-Build 支持静态二维码流程的 SVG 下载。包含可编辑重定向 URL 和扫描分析的动态二维码按当前计划规则提供。请查看当前计划获取最新计划功能和价格。
可以在 Adobe Illustrator 中使用 SVG 二维码吗?
可以。SVG 文件可在 Adobe Illustrator 中原生打开。导入后使用 Object > Ungroup 访问单独路径,然后无损调整到任何尺寸。QR-Build 的 SVG 输出使用独立路径数据,不含嵌入栅格,适合生产审查。印刷导出前请将文档颜色模式切换为 CMYK。
二维码中 SVG 和 EPS 有什么区别?
SVG 和 EPS 都是可无损缩放的矢量格式。SVG 是现代标准,受浏览器、Figma、Illustrator、InDesign 和主流设计工具支持。EPS 是旧式 PostScript 格式,仍用于专业印前环境。对于 2026 年的大多数流程,建议使用 SVG;只有当印刷供应商系统明确要求时才选择 EPS。
可以把 SVG 二维码做成动态的吗?
SVG 文件始终是静态文件,因为编码图案在下载时固定。但是,如果二维码在 QR-Build 中创建为动态二维码,它会指向可在仪表板更新的重定向 URL。已印刷 SVG 不会改变;只有它重定向到的目标会更新。这让动态 SVG 二维码适合 URL 可能变化的印刷活动。
如何在网站上嵌入 SVG 二维码?
将 SVG 源码作为 inline SVG 元素直接粘贴到 HTML 中,可用 CSS 控制且无需额外 HTTP 请求。也可以使用带描述性 alt 属性的 img 元素实现更简单的方案。为无障碍访问,请为 inline SVG 标记添加 role="img" 和 aria-label,让辅助技术了解二维码用途。
SVG 二维码在广告牌尺寸下能扫描吗?
可以。SVG 不依赖分辨率,因此放大到广告牌尺寸不会造成质量下降。大幅格式的可扫描性取决于对比度、四周至少 4 个模块宽度的静区,以及合适的纠错级别。文件格式保护清晰度,但扫描质量仍取决于最终印刷 artwork。
什么是静区,为什么它对印刷重要?
静区是二维码周围的空白边框,可让扫描器定位并读取图案。建议的最小静区是四周 4 个模块宽度。将 SVG 二维码放入版式软件时,确保静区没有在放置过程中被裁掉,因为这是印刷二维码无法扫描的常见原因。
如何在不损失质量的情况下调整 SVG 二维码大小?
通过拖动角部控制点或在设计工具的变换面板中设置具体尺寸来调整 SVG 大小。由于 SVG 基于矢量,不需要重新采样或设置分辨率。Illustrator、Figma、InDesign 和其他矢量编辑器可在任何比例下保持完整质量。
可以给 SVG 二维码添加 logo 吗?
可以。QR-Build 支持在下载 SVG 前的二维码创建过程中叠加 logo。添加 logo 时,如果可用,请使用纠错级别 Q 或 H,以便二维码具有更高恢复能力。批准印刷前务必扫描测试最终设计的二维码。
哪些软件可以打开 SVG 二维码文件?
SVG 文件可在 Adobe Illustrator、Figma、Adobe InDesign、CorelDraw、Inkscape、Sketch、Affinity Designer 以及当前计划支持 SVG 上传的 Canva 中打开。SVG 也可由 Chrome、Firefox、Safari 和 Edge 原生渲染,无需插件。
二维码中 SVG 和 PNG 有什么区别?
SVG 是矢量,PNG 是栅格。SVG 可缩放到任意尺寸而不改变边缘质量,而 PNG 具有固定像素分辨率,放大时可能变模糊。印刷、包装、大幅输出和网页内联嵌入使用 SVG。最终图像尺寸固定的数字场景使用 PNG。
如何在 Figma 中使用 SVG 二维码?
从 QR-Build 复制 SVG 源码并直接粘贴到 Figma 文件中,或将下载的 SVG 文件拖到画布上。Figma 会将 SVG 作为可编辑矢量几何导入,可调整大小、重新着色或嵌套到组件中。任何样式更改后都要测试最终二维码。
为什么我的 SVG 二维码放入版式后无法扫描?
最常见原因是静区被裁掉,即 SVG 在版式软件中放置或加框时空白边缘被修剪。请恢复四周至少 4 个模块宽度的空白。第二个常见原因是低对比度。SVG 与 PNG 并不决定扫描成功;决定因素是对比度、静区、尺寸和纠错。
相关二维码工具
生成可用于生产的 SVG 二维码
为印刷、包装、设计软件或网页嵌入创建干净的矢量二维码。固定目标使用静态 SVG;当已印刷二维码需要可编辑 URL 时,选择动态二维码。
没有栅格包裹。为专业交接提供干净矢量输出。