在 SVG 中嵌入图像和字体
添加 1 个 SVG 以及它引用的图像（PNG、JPEG、WebP、GIF）或字体（TTF、OTF、WOFF、WOFF2），并将它们合并到 1 个 SVG 中，这样就无需单独共享素材。为每项引用指定要使用的素材并创建 SVG。预览成功显示后即可保存。不会自动获取外部 URL 中的素材。
可执行的操作
打包图像和字体
将添加的本地素材嵌入 SVG，减少单独发送素材的需要。
检查引用和素材
为 SVG 中的每个图像路径或字体名称指定对应文件。所有引用均解决后才会创建 SVG。
检查创建的 SVG 并保存
检查 SVG 作为图像的显示效果，并保存已嵌入素材的 SVG。不会覆盖原始文件。
使用方法
添加 SVG 和素材
选择一个 SVG 及其引用的图像和字体。也可以从文件夹中一起添加。
映射要嵌入的素材
检查每个引用应使用哪个本地文件。对于未自动匹配的引用，请从已添加的素材中选择。
创建 SVG
所有引用均解决后，点击“创建包含图像和字体的 SVG”。
检查显示效果并保存
保存前检查创建后的预览中的文本和图像。如果无法显示，请检查原始 SVG 和素材。
适用场景
连同素材一起交付 SVG
将引用了不同文件夹中图像和字体的图形合并为一个便于交付的 SVG。
检查引用失效的原因
将所需素材与已添加的文件进行比较，然后指定任何缺失的图像或字体。
引用与嵌入的工作方式
相对路径和文件匹配
当相对于 SVG 的引用路径与已添加素材的路径唯一匹配时，会自动匹配。若不同文件夹中有同名文件或候选项相互冲突，请手动选择。
为每个字体名称指定文件
此工具不会仅根据 SVG 中的字体名称从设备提取字体。请添加所需字体文件并指定匹配的文件。
不会自动获取 URL 中的素材
即使引用的是外部 URL，也请在本地提供图像或字体并进行指定。此页面无法从 URL 获取素材。
嵌入素材与减小文件大小是两回事
将图像数据包含在 SVG 中可能会增加 SVG 文件本身的大小。字体会转换为 WOFF2 并嵌入。请使用单独的工具优化 SVG 代码。
显示方式可能造成差异
预览会将 SVG 显示为图像。不同应用中的显示效果不一定相同，因此请在目标应用中也检查所需的显示效果。
常见问题
如果找不到素材该怎么办？
添加图像或字体，然后在对应引用的选择字段中指定这些文件。如果文件夹不同、路径重复或使用外部 URL，自动匹配可能会失败。
可以使用哪些素材？
图像可以是 PNG、JPEG、WebP 或 GIF；字体可以是 TTF、OTF、WOFF 或 WOFF2。SVG 请逐个指定。
它会自动查找字体吗？
此工具不会仅根据字体名称搜索设备或网络中的字体。请添加并选择本地已有的文件。
已嵌入的素材会怎样处理？
作为 data URI 嵌入的图像和字体，以及 SVG 中的 # 引用，不计为外部引用。只要没有未解决的已检测引用，就可以创建 SVG。
添加或重新选择素材时会怎样？
如果只添加素材，它们会加入列表，并保留先前已分配的素材。例如，当出现更多路径相同的候选项时，请检查自动匹配结果。若输入中包含新的 SVG，则当前 SVG 及其所有素材都会被替换。
如果存在不支持的引用怎么办？
无法嵌入外部用途或脚本引用。包含外部 CSS 导入的 SVG 也无法加载。请选择 SVG 前，请在原始应用或其他合适的应用中整理这些引用。
SVG 会变小吗？
此工具的用途不是减小文件大小。将素材包含在 SVG 中可能会增大文件。若要清理代码，请使用 SVG 优化工具。
如果创建的 SVG 无法显示怎么办？
只有 SVG 成功显示后，此页面才会显示保存选项。请检查原始 SVG 和素材，查看映射或文件，然后重新创建。
输入和结果
- 输入
- 1 个 SVG 及其引用的图像和字体。可从文件或文件夹添加。
- 图像
- 嵌入所添加图像的原始数据。不会调整图像尺寸或进行压缩。
- 字体
- 映射的字体会转换为 WOFF2 并嵌入。
- 输出
- original-name-embedded.svg。创建的 SVG 成功显示后即可保存。