Quick answer
Start with normal rel=icon declarations and a stable ICO or PNG fallback. Test the public page in current Safari rather than relying on behavior inherited from other browsers.
- Last verified
- July 31, 2026
- Evidence
- Primary documentation plus transparent editorial analysis
- Primary sources
- 2
Browser tabs and bookmarks
Start with normal rel=icon declarations and a stable ICO or PNG fallback. Test the public page in current Safari rather than relying on behavior inherited from other browsers.
A self-contained SVG can work well for modern tab rendering, but the ordinary icon stack does not replace the dedicated Apple touch asset used for web clips.
Connected next stepChrome Favicons: Tabs, Android, PWAs, and Cache Checks for the closest prerequisite or comparison.
Apple touch icons
Provide a square 180×180 PNG through rel=apple-touch-icon. Give it a deliberate background and safe corner spacing because the operating system applies its own presentation treatment.
Removing and re-adding a home-screen shortcut may be necessary after changing the touch icon; reloading an open tab does not refresh that installed surface.
Connected next stepFavicons in Firefox: Tabs, Bookmarks, SVG, and Cache Testing for the next connected implementation decision.
Pinned tabs and verification
Pinned tabs historically used Safari-specific monochrome vector treatment. Treat that as an additional specialized asset only when analytics justify it, not as a replacement for the cross-browser favicon set.
Use Safari Web Inspector and direct asset requests to separate a file-response problem from a local icon cache.
Connected next stepOpen the most relevant production tool and verify the decision with a working output.
Review the headings, sources, implementation artifact, and update record for this guide as structured JSON.
Download guide evidence ↓- Guide
- Safari Favicons: Tabs, Pinned Tabs, and Apple Touch Icons
- Coverage
- Client behavior can change by browser, operating system, platform version, cache state and deployment configuration. Unperformed manual observations are not claimed.
Questions, answered
Is apple-touch-icon the same as favicon.ico?+
No. It is a dedicated high-resolution PNG for Apple home-screen shortcuts.
Do I need a pinned-tab icon?+
Only if that Safari surface matters to the project; keep it separate from the normal browser and touch icons.