Safari pinned tab icon: what it is and why it matters
Safari supports pinned tabs. You can provide a monochrome SVG icon via rel="mask-icon" to look great in that UI.
How to add it
- Create a simple monochrome SVG (avoid tiny details).
- Add: <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#111111">
- Make sure it’s reachable and served as image/svg+xml.
Optional
mask-icon is optional. Your core set (SVG/ICO/PNG) is still the priority.
FAQ
Is mask-icon required?
No. It’s a nice-to-have for pinned tabs in Safari.
Why does it look different?
Pinned tab icons are monochrome and very small. Keep the shape bold and simple.