创建最佳收藏夹的生成器

教学

过去，你必须为不同的浏览器及其版本创建几十个网站图标。但现代网站建设已经发生了很大变化。现在，我们只需一个 svg 文件、一个 favicon 文件、三个 png 文件和一个 json 文件，就能创建一个精美的网站图标。您可以阅读 本文中了解更多信息.

HTML:

<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<!-- 180x180 - first for safari --> 
<link rel="icon" href="/favicon.ico" sizes="any"><!-- 32x32 --> 
<link rel="icon" href="/icon.svg" type="image/svg+xml"> 
<link rel="manifest" href="/manifest.webmanifest">

任务文件

// manifest.webmanifest
{
   "icons": [
      { "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
      { "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" }
   ]
}

Yandex 浏览器 Tableau

只有 Yandex 浏览器的 tableau 增加了一些问题。如果您想让自己的网站在 tableau 上（打开新标签页时）看起来更美观--您需要创建一个清单文件和一张透明背景的 png 图片，长宽比为 1:3。

这一行将添加到标题中： 

<link rel="yandex-tableau-widget" href="/tableau.json">

并在根目录下为 Yandex 创建一个清单文件：

{
   "version": "1.0",
   "api_version": 3,
   "layout": {
      "logo": "/tableau.png",
      "color": "#003C8C",
   }
}

在颜色栏中指定您希望在 Yandex 浏览器 Tableau 中看到的背景颜色。 徽标 - 是图片的路径。 更多详情，请参阅本文.

发电机

使用下面的表格以任意格式（jpg、png、svg）上传您的网站徽标文件，即可获得一套五个图标！最大尺寸： 5мб

将正方形徽标文件拖放到此处或点击。

附加一个边缘有小缩进的正方形徽标文件 (~10%).
背景可以是透明的，也可以是彩色的;
接受 png 格式的图标；
接受 svg 格式的图标；
接受 jpg 格式的图标；

图标生成器将创建