Favicon 產生器
一張 PNG、JPG 或 SVG,產生 favicon.ico 和網站需要的全部圖示尺寸,打包成 ZIP。
非正方形圖片
完整保留畫面,置中顯示,四周留白。
背景
分頁圖示用透明就很好;要兼顧 iPhone 主畫面的話,選個背景色更穩妥。
你的圖示包
產生的 favicon 和圖示包會顯示在這裡。
加入 <head>
把這些檔案放到網站根目錄,再把上面幾行加到每個頁面。
你的圖片會在瀏覽器本機產生圖示,不會上傳到 BroBroGo。
常見問題
圖示包裡有哪些檔案?
包含 16、32、48 像素三種尺寸的 favicon.ico,16、32、180、192、512 像素的 PNG 圖示,以及列出大圖示的 site.webmanifest。如果來源是 SVG,向量圖示本身也會一併放入。所有檔案打包成一個 ZIP。
來源圖片要多大才合適?
最理想的是 SVG——每個尺寸都直接由向量繪製,16 像素也清晰銳利。PNG 或 JPG 建議至少 512 × 512,更小的圖片放大後會模糊。
背景該用透明還是顏色?
分頁圖示用透明沒問題;但 iPhone、iPad 的主畫面會把透明區域顯示成黑色——如果訪客可能把你的網站加到主畫面,建議選一個背景色。
圖片不是正方形會怎樣?
圖示是正方形的,但你的圖片絕不會被拉伸變形。預設把畫面完整置中、四周留白;切換到「裁切填滿」則會裁掉長邊。
這些檔案要放到網站的什麼位置?
上傳到網站根目錄,讓 favicon.ico 能透過 /favicon.ico 存取,再把產生的程式碼貼到頁面的 <head> 裡。瀏覽器會自動挑選合適的尺寸。