如何将 .svg 文件转换为字体? [关闭]

     2023-03-06     279

关键词:

【中文标题】如何将 .svg 文件转换为字体? [关闭]【英文标题】:How can I convert .svg files to a font? [closed] 【发布时间】:2012-10-28 00:56:54 【问题描述】:

如何将 .svg 文件转换为字体?有没有 API 或可编程的方法?

【问题讨论】:

你有什么样的 SVG 文件?您是否有包含 SVG 字体的 SVG 文件(使用 等标签)? 您可以编写 fontforge 脚本来执行此操作,但这取决于您的输入文件是否足够简单,可以用字体表示。 如果你正在寻找一个 API,你可以从 Mashape mashape.com/warting/online-font-converter查看这个 API 【参考方案1】:

我在 Stack Overflow 上找到了两个相关的答案:

    Creating icon fonts with vector software (i.e. inkscape) and fontforge? Tools to convert svg to ttf [closed](存档自此deleted SO question)

不幸的是,两者都不是真正的 编码 答案,而这正是我真正希望的(用于脚本转换的命令行实用程序,或者可能是有人可以用来编写此类东西的 API)。

不过,通过结合这两个答案,我得到了我正在寻找的东西。

清理 SVG

(此步骤可能是可选的。) 在免费软件程序 InkScape 中打开您的 SVG。复制现有的 SVG 并从 FontForge Glyph 模板创建一个新项目。粘贴到该模板中,标准化外观、大小和位置,然后另存为 PLAIN SVG,每个字符一个文件(“字形”)。

将 SVG 转换为字体

然后,要么直接使用免费软件程序FontForge(按照第一个答案creating icon fonts with vector software 的指示),要么使用免费的IcoMoon 在线服务(按照第二个答案tools to convert svg to ttf 的指示)。我是后者。

使用图标月亮

IcoMoon 是一个相当简单的工具。单击页面顶部的紫色 导入图标 按钮以导入您的每个自定义 SVG 字形。然后单击集合首选项上的“获取信息”,以便您可以命名集合并为其提供一些元数据。使用“编辑”工具(铅笔图标)并单击每个字形以调整大小和间距。

完成后,选择字体中所需的所有字形,然后按页面底部的“生成字体”按钮。在结果屏幕上,您可以将每个字形映射到一个 Unicode 字符。在右侧,您可以键入或粘贴一个字符,或者在左侧,您可以输入其十六进制代码。 GNOME Character Map(适用于 Linux)或 Windows Character Map 或 Mac OS Character Palette 之类的程序可以帮助您找到适合您的字形的代码。

现在按屏幕顶部的“首选项”按钮(或右下角的齿轮)并确定新字体的名称和元数据,然后按右下角的“下载”。您将获得一个 Fontname.zip 文件,其中包含一堆使用建议以及字体文件本身。

迭代

我发现尺寸和间距真的很难调整好(我在写字母)。我一直在 IcoMoon 上进行迭代,安装字体,并将我的字母与类似字体的字母进行比较(使用文字处理器)。调整大小很容易,但间距不是那么容易(我什至没有弄乱ligatures 或kerning!)。不要忘记某些系统在安装新字体后需要刷新字体缓存(在 Linux 上,即 fc-cache 来自 Fontconfig)

验证字体

您可能还想验证您的字体。 Font Squirrel 是一项在线服务,可让您执行此操作,提供更正和使用提示。我认为 IcoMoon 已经这样做了,所以也许这仅对 FontForge 创作有用。

【讨论】:

作为一种编程解决方案,我推荐gulp-iconfont。我需要设置选项fontHeight=1024 (> 1000),否则字体似乎已损坏,但最后我得到了与 icomoon 相同的结果。 用于将文件转换为 tff 的 *** 链接是一个死链接.... 没想到 SO 会是它自己的链接腐烂受害者。 @DouglasGaskell – 好电话。如果您拥有超过 10,000 名声望,您可以通过 moderator access 在 SO 上查看已删除的内容。我认为 Q&A 不值得取消删除,因此我使用存档副本更新了链接。【参考方案2】:

有多种在线工具可让您上传 SVG 文件并将其用作创建图标字体的图标。就个人而言,我更喜欢 Icomoon App

Icomoon 应用程序允许您执行以下各项操作:

从几种流行的图标字体中获取一个或多个图标 上传其他字体,可以是图标字体,也可以是普通字体 上传 SVG 文件以用作图标 从任意数量的可用字体中组合任意数量的图标 为您需要的任何字符设置 UNICODE 十六进制值 导出和/或保存您创建的字体集

【讨论】:

【参考方案3】:

正如其他人所写,可以将 svg 形状导入 fontforge,并且一些字体设计师就是这样工作的。

但是,形状(轮廓)只是现代智能字体的一部分,因此它本身是不够的。您还需要处理元数据、字距调整、提示等。这是很多绝对不好玩、困难但必要的东西,而潜在的字体设计师通常梦想着自我奖励的艺术绘画,而不是其他。

这就是 svg 字体从未成为一种格式的原因之一,它们缺少太多对渲染文本有用的部分。

【讨论】:

如何将文本转换为 SVG 路径?

】如何将文本转换为SVG路径?【英文标题】:HowtoconverttexttoSVGpaths?【发布时间】:2011-12-0605:29:23【问题描述】:我在ttf文件中有一个字体,并且想要生成SVG,并将文本转换为路径。我不需要图像(因此使用imagettftext或ImageMagick字... 查看详情

如何制作图标字体(如何将svg转换为css可用的图标字体)

转自: 如何制作图标字体(如何将svg转换为css可用的图标字体)具体描述在项目开发当中,我们常常遇到需要将获取到的svg转换为,css可用的图标字体,那么具体该如何进行操作呢具体操作登录icomoon点击右上角登录旁边的ic... 查看详情

如何制作图标字体(如何将svg转换为css可用的图标字体)

转自: 如何制作图标字体(如何将svg转换为css可用的图标字体)具体描述在项目开发当中,我们常常遇到需要将获取到的svg转换为,css可用的图标字体,那么具体该如何进行操作呢具体操作登录icomoon点击右上角登录旁边的ic... 查看详情

如何将 PNG 图像转换为 SVG? [关闭]

】如何将PNG图像转换为SVG?[关闭]【英文标题】:HowtoconvertaPNGimagetoaSVG?[closed]【发布时间】:2010-12-2402:24:16【问题描述】:如何将PNG图像转换为SVG?【问题讨论】:通过一些应用程序或通过操作系统命令?如果通过操作系统,请... 查看详情

将 PDF 转换为干净的 SVG? [关闭]

...本中的每个字母映射一个路径,这意味着如果我更改其源文件中的文本,它看起来很难看。我想知道最干净的PDF到SVG转换器是什么,希望它没有路径,它的文本区域根本不需要。我们知道,PDF和SVG非常相似,所以我 查看详情

如何将 SVG 文件转换为 JPEG?

】如何将SVG文件转换为JPEG?【英文标题】:HowtoconvertanSVGfileintoaJPEG?【发布时间】:2021-08-2705:16:28【问题描述】:我在Mac应用程序的按钮中使用SF符号,但因为我正在尝试自定义它们的颜色以更好地适应主题。我正在考虑将基于... 查看详情

将 Google 字体路径转换为 ​​SVG 路径

】将Google字体路径转换为​​SVG路径【英文标题】:ConvertGooglefontspathtoSVGpath【发布时间】:2020-11-0211:37:14【问题描述】:我正在尝试按照https://github.com/danmarshall/google-font-to-svg-path的示例将Google字体创建为svg。我的代码如下:opent... 查看详情

如何将wmf文件转换为svg文件(代码片段)

如何将WMF文件转换为svg文件?我有大约550个WMF文件要转换为SVG格式。对于一个文件,我在VISIO中打开WMF文件并将其保存为SVG格式,但要转换大约550个文件是一个繁琐的过程。请帮助我实际上,这些WMF文件是PDF文档中的转换文件。... 查看详情

如何将 SVG 文件转换为 HTML5 的画布?

】如何将SVG文件转换为HTML5的画布?【英文标题】:HowtoconvertSVGfilestoHTML5\'scanvas?【发布时间】:2011-02-2320:27:27【问题描述】:有没有办法将SVG文件转换为HTML5的画布兼容命令?【问题讨论】:【参考方案1】:Inkscape(矢量图形免... 查看详情

将 svg 转换为图像的库? [关闭]

】将svg转换为图像的库?[关闭]【英文标题】:Alibrarytoconvertsvgtoimages?[closed]【发布时间】:2011-09-1308:09:25【问题描述】:我正在寻找一个用C或C++编写的库,它可以将svg转换为图像格式。我遇到了将svg转换为图像的inkscape。但要使... 查看详情

如何在 C# 中将 SVG 文件转换为 EMF 文件

】如何在C#中将SVG文件转换为EMF文件【英文标题】:HowtoconvertanSVGfiletoanEMFfileinC#【发布时间】:2014-11-2622:03:29【问题描述】:绝对可以将SVG转换为EMF,例如thiswebsite。我想知道是否有可能在C#中实现这种转换?更新:我尝试使用SVG... 查看详情

如何从PNG图像制作字体图标?

】如何从PNG图像制作字体图标?【英文标题】:Howtomakeafont-iconfromPNGimage?【发布时间】:2014-10-1911:39:28【问题描述】:目前我正在为我的图标使用.png图像。我想将它们转换为字体图标并改用它们。我正在做的是将图像转换为SVG,... 查看详情

用于将 TTF/OTF 字体转换为 SVG 的命令行工具

】用于将TTF/OTF字体转换为SVG的命令行工具【英文标题】:Command-linetoolforconvertingTTF/OTFfontstoSVG【发布时间】:2012-10-1618:38:33【问题描述】:有人知道可以将TTF和OTF字体转换为SVG字体的命令行工具吗?【问题讨论】:【参考方案1】... 查看详情

使用 C# 将 SVG 转换为 PNG [关闭]

】使用C#将SVG转换为PNG[关闭]【英文标题】:ConvertingSVGtoPNGusingC#[closed]【发布时间】:2010-09-0816:54:09【问题描述】:我一直在尝试使用C#将SVG图像转换为PNG,而无需编写太多代码。任何人都可以推荐一个库或示例代码来执行此操作... 查看详情

将png图片转换为字体图标(代码片段)

...WebApp2点击左上角ImportIcons批量倒入之前已经转成svg的图标文件3点击选中所倒进来的图标,也可以点击右边的menu图标全选4点击右下角GenerateFonts生成图标5点击右下角已经变成Download的按钮,下载iconfonts压缩包3.将下载的压缩包中的... 查看详情

如何将图像文件从 SVG 转换为多尺寸 ICO 而不模糊(锐利)

】如何将图像文件从SVG转换为多尺寸ICO而不模糊(锐利)【英文标题】:HowtoconvertanimagefilefromSVGtoamulti-sizeICOwithoutblur(sharp)【发布时间】:2017-01-0810:15:38【问题描述】:我一直在使用ImageMagick,但它产生的结果非常模糊。convert-dens... 查看详情

如何将svg图标快速转换成字体图标?

  今天遇到一个客户需要我将页面的图标做成字体图标,想想哎可能整的麻烦,不过想想这也是对项目的一个优化 (1.字体图标直接用color自由控制颜色;2.整合在一起,减少http请求等   PS:平时了解这些,就是麻... 查看详情

如何使用 ImageMagick 将 SVG 转换为 PNG?

】如何使用ImageMagick将SVG转换为PNG?【英文标题】:HowtoconvertaSVGtoaPNGwithImageMagick?【发布时间】:2012-04-0820:19:25【问题描述】:我有一个定义为16x16大小的SVG文件。当我使用ImageMagick的转换程序将其转换为PNG时,我得到一个16x16像... 查看详情