Menu

Favicon Pack in the Browser: One Image In, Nine Files Out
πŸ“°

Favicon Pack in the Browser: One Image In, Nine Files Out

DEV Community: htmlΒ·OnePassAppsΒ·12 days ago
#6N8zck4N
#devto2#devto#dev#favicon#pack
Reading 0:00
15s threshold

Favicon pack in the browser: one image in, nine files out

Every site needs a favicon, and most projects end up with a folder of near-duplicates that somebody has to resize by hand: a 16Γ—16, a 32Γ—32, a 48Γ—48, an Apple touch icon, two Android sizes, an .ico , a web manifest, and an HTML snippet to paste into the page head. Nine files, one source image.

Full disclosure first: I work on OnePassApps. The Icon Studio of app.onepassapps.com does that conversion in the browser tab, so the source image is read and written on your own machine and never uploaded.

What the panel says before you start

The Favicon pack tab opens with two honest limits and one instruction:

01 Source β€” "No SVG or PNG yet. Drop one on the stage or browse for it. SVG up to 5 MiB, PNG up to 24 MiB."

02 Pack details β€” "Name the app for the manifest once an image is open. The pack covers 16 to 512 pixels."

So one image, SVG or PNG, and the pack covers the 16-to-512-pixel range.…

Continue reading β€” create a free account

Join HashtagPLUS to read full articles, follow hashtags, vote, and join the conversation.