Reference
Favicon 必须是方形吗？
在实践中，是的。favicon 显示在方形的位置里（标签页、书签、主屏幕磁贴），所以一个非方形图像要么被空白填补留边、要么被扭曲以塞进去。文件严格来说并非必须是方形，但任何不是方形的都看起来是错的，这就是为什么每个图标尺寸都被定义为一个 N×N 的方形。把一个宽幅 logo 缩减为一个方形符号，而不是把它挤压进去。
到处都是方形的位置
每一个显示 favicon 的位置都为它预留了一个方形。把一个矩形喂进一个方形，浏览器要么给它留边（你的标志缩小，四周环绕空白条），要么把它拉伸得比例失调。两者看起来都不像是刻意的。
这就是为什么标准尺寸全都是 N×N。从一开始就把源图设计成方形，意味着每个位置都恰好得到它所期望的。
Favicon 形状常见问题
favicon 必须是方形吗？
实际上是的。它显示在方形的位置里，所以一个非方形图像会被留边或扭曲。把源图做成方形以避开这两者。
如果我的 logo 是宽的怎么办？
只用符号或一个首字母，而不是整套组合。一个宽幅 logo 被挤进一个方形 favicon 会变得无法辨认。
favicon 该用什么宽高比？
1:1，一个完美的方形。每一个 favicon 尺寸，从 16px 到 512px，都被定义为等宽等高。