css – 如何将.svg文件转换为字体?

前端之家收集整理的这篇文章主要介绍了css – 如何将.svg文件转换为字体?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
任何人都可以帮我将.svg文件转换为字体文件吗?或者有没有办法在飞行中做到这一点?

解决方法

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

> Creating icon fonts with vector software (i.e. inkscape) and fontforge?
> Tools to convert svg to ttf [closed]

不幸的是,这两者都不是真正的编码答案,这是我真正希望的(脚本转换的命令行实用程序,或者也许是某人可以编写这样的东西的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

IcoMoon是一个相当简单的工具.单击页面顶部的紫色“导入图标”按钮以导入每个自定义SVG字形.然后在设置的首选项上单击“获取信息”,这样您就可以为该组命名并为其提供一些元数据.使用“编辑”工具(铅笔图标)并单击每个字形以获得尺寸和间距恰到好处.

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

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

迭代

我发现尺寸和间距很难正确(我正在写信).我一直在迭代IcoMoon,安装字体,并将我的字母与字母相似(使用文字处理器).尺寸调整很容易,但间距不是那么容易(我甚至没有弄乱ligatureskerning!).不要忘记某些系统在安装新字体后需要刷新字体缓存(在Linux上,这是Fontconfig的fc-cache)

验证字体

您可能还想验证您的字体. Font Squirrel是一项在线服务,可让您这样做,提供更正和使用技巧.我认为IcoMoon已经这样做了,所以也许这只是用于FontForge创作.

猜你在找的CSS相关文章