使用字体真棒图标作为网站图标

Answers:

38

是的。只需截取具有所需字符的内容的屏幕快照，剪切所需的部分并将其保存为图像（.ico）。

认真来说，您可能要检查每个浏览器支持的格式：http : //en.wikipedia.org/wiki/Favicon#File_format_support

如果您的字符是图像或矢量文件，则大多数浏览器都可以，但是IE （因为MS讨厌您）是可以的。否则，您真的必须首先将它们另存为图像。

— 雷南
source
3
许可证是否允许？
— art-solopov
3
@ art-solopov是的，它的确是-您可以在其许可页面上查看：fortawesome.github.io/Font-Awesome/license
— Renan
我已经阅读了OFL，但没有发现任何与更改字体格式或从字形组成图像有关的内容。抱歉，如果我缺少任何内容，能否请您指出我的特定部分？谢谢。
— art-solopov
因建议截图而投票不足。有许多无损方法可以实现这一目标。
— metaColin
2
@marcogmonteiro如果您访问fontawesome.com/download，则可以将图标下载为.svg文件。大多数浏览器都会接受.svg资产作为网站图标。如果需要支持IE的旧版本，则可以通过使用Photoshop或Illustrator转换.svg来获得很好的原始栅格资源（例如.png）。
— metaColin
289

编辑：我建议您使用http://gauger.io/fonticon

我已经创建了一个在线Font Awesome Favicon Generator来做到这一点！

请参阅Font Awesome Favicon Generator。

— 保罗·费雷特
source
7
好人，快捷有效。+1！
— 2015年
2
需要让我们定义颜色！
6
@Freddy实际上，生成器已经可以做到这一点，我只是还没有为其构建UI。使用RGB HEX颜色值分别为背景和前景传入参数bg和fg。例如，paulferrett.com/fontawesome
— 保罗·
7
@ paul-ferrett：是否可以更改生成的图标的大小？
— vgoklani 2015年
4
很好的实现。不幸的是，如今仅16x16网站图标是不够的。下载包含所有必需大小的所有必需图标的zip会很好。
— coorasse
85

我还创建了一个在线Font Awesome Favicon Generator，它具有Paul Ferrett解决方案中缺少的其他功能。

网站图标

  • 在浏览器中实时预览Favicon
  • 图标的大小
  • 透明图标和背景
  • 巨大的图像尺寸（图标可以根据需要提供详细信息）
  • iconset可以通过github pull request更新
  • 更新06/2017更新为Font Awesome 4.7
  • 更新06/2017模糊搜索和关键字搜索
  • 更新09/2017堆叠的图标
  • 更新06/2018更新为Font Awesome 5.0.13
  • 更新11/2018更新为Font Awesome 5.5.0
  • 更新04/2019更新为Font Awesome 5.8.1
  • 更新04/2019添加了对Font Awesome Pro的支持！

如果您需要其他功能，请随时在此处提交问题或请求请求。

— 蚀
source
@vgoklani如果您有任何建议，请让我知道:)
— 蚀
@eclipse：非常感谢！这为我节省了很多痛苦。
— SAM
感谢您付出的巨大努力，首先要注意以下几点：下载图像时，宽度和高度始终为1024，应将其调整为实际大小。 第二：应该写入滑块值的大小，或者可以在数字框中设置更好的值
— Saif
1
我通过堆叠图标支持对其进行了增强。公关正在等待审查。
— trung
2
我喜欢实时标签预览功能！
— Tot Zam
11

任何图像都可以上传到网站图标生成器网站，例如

http://favicon-generator.org/

要么

http://www.favicon.cc/

请按照您选择的网站上的在线说明进行操作。它通常只是一个三步过程。将收藏夹图标保存在网站的顶层。

为了实现跨浏览器的兼容性，我建议始终将图像用作收藏夹图标。即使您创建的某些站点仅适用于现代浏览器，仍然会将您的收藏夹插图转换为图像。始终如一地使用相同的过程，您无需担心什么。

— 其他戴维
source
2
“请注意，如果您的网站是本地网站，则只有当您将网站上传到虚拟主机时，网站图标才会在Chrome中显示”。那是不对的。
— 2015年
如果您在本地查看收藏夹图标时遇到问题。stackoverflow.com/questions/16375592/…–
— otherDewi
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.