Favicon PNG Generator
Create common favicon and app icon PNG sizes from one image
Favicon PNG Generator — what it does
Upload one square image and download the set of PNG sizes browsers and devices actually request: favicon sizes for tabs, touch icons for iOS home screens, and the larger sizes Android and PWA manifests expect. One source image in, the whole icon family out, each size properly downscaled.
When this tool helps
- Generating the icon set for a new website from the logo mark.
- Producing the touch and manifest icons a PWA needs to install cleanly.
- Refreshing icons after a rebrand without reopening the original design files.
How to use it
- Choose a square source image, ideally 512 pixels or larger.
- Let the tool render each standard size.
- Download the PNG files.
- Reference them from your HTML head and manifest.
Accuracy, limits, and good practice
- Design for 16 pixels: a mark that survives the smallest favicon works everywhere; fine detail and thin strokes vanish at tab size.
- Start from a flat, high-contrast version of your logo rather than a photograph — icons read as shapes, not pictures.
- Browsers cache favicons aggressively; append a version query to the icon URL when you replace one, or you will keep seeing the old icon.
Frequently asked questions
Do I still need an ICO file?
Modern browsers accept PNG favicons. The ICO format matters mainly for very old browsers and some Windows contexts.
What HTML do I add?
Link tags for the favicon sizes and an apple-touch-icon link, plus icon entries in the web manifest for the large sizes.
Why does my icon look blurry in tabs?
Usually a non-square or small source. Start square at 512 pixels or more so each downscale stays crisp.
Related tools on this site
- Image Color Inverter — Invert image colors or create a photographic negative
- Local Blur & Mosaic — Blur or pixelate a selected rectangular image area
- Screenshot Stitcher — Join multiple screenshots vertically or horizontally
Everything above runs inside this page. Favicon PNG Generator needs no account, no upload, and no server round trip — close the tab and nothing is left behind.
Favicon PNG 產生器能做什麼
上傳一張方形圖片，下載瀏覽器與裝置實際會請求的整套 PNG 尺寸：分頁用的 favicon、iOS 主畫面的觸控圖示，以及 Android 與 PWA manifest 需要的大尺寸。一張來源圖進去,整個圖示家族出來，每個尺寸都經過正確縮放。
什麼時候用得上
- 用商標圖為新網站產生整組圖示。
- 產出 PWA 乾淨安裝所需的觸控與 manifest 圖示。
- 改版品牌後更新圖示，不必重開原始設計檔。
使用步驟
- 選擇方形來源圖，建議 512 像素以上。
- 由工具算繪各標準尺寸。
- 下載 PNG 檔案。
- 在 HTML head 與 manifest 中引用它們。
精確度、限制與實務建議
- 以 16 像素為設計基準：能在最小 favicon 存活的圖形到哪都行；細節與細線在分頁尺寸下會消失。
- 請從平面、高對比的商標版本出發，而不是照片——圖示靠形狀辨識，不靠畫面。
- 瀏覽器對 favicon 快取極兇；換圖時在圖示網址加上版本參數，否則會一直看到舊圖。
常見問題
還需要 ICO 檔嗎？
現代瀏覽器都接受 PNG favicon。ICO 主要影響非常舊的瀏覽器與部分 Windows 情境。
HTML 要加什麼？
各尺寸的 favicon link 標籤、一個 apple-touch-icon link，以及 manifest 中大尺寸的 icon 條目。
為什麼分頁上的圖示糊糊的？
多半是來源不方正或太小。請從 512 像素以上的方形圖開始，每次縮小才能保持銳利。
本站相關工具
以上步驟全部在這個頁面內完成，Favicon PNG 產生器 不需要註冊、不上傳檔案、也不經過伺服器，關閉分頁後不會留下任何資料。