{
    "content": "<p>The <a href=\"..\/apple-touch-icon-120x120.png\/\">apple-touch-icon-120x120.png<\/a> is a high-resolution <a href=\"..\/PNG\/\">PNG<\/a> image file used by <a href=\"..\/Apple\/\">Apple<\/a> mobile devices to represent a <a href=\"..\/Web Application\/\">Web Application<\/a> or <a href=\"..\/Website\/\">Website<\/a> on the home screen. This specific dimension of 120x120 pixels is primarily utilized by <a href=\"..\/iPhone\/\">iPhone<\/a> models equipped with a <a href=\"..\/Retina Display\/\">Retina Display<\/a> to ensure visual clarity and sharpness. When a user selects the 'Add to Home Screen' option within the <a href=\"..\/Safari\/\">Safari<\/a> browser, the <a href=\"..\/iOS\/\">iOS<\/a> operating system scans the <a href=\"..\/HTML\/\">HTML<\/a> document for a <code>&lt;link&gt;<\/code> element with the attribute <code>rel=\"apple-touch-icon\"<\/code>. If a version matching the 120x120 <a href=\"..\/Resolution\/\">Resolution<\/a> is found, it is cached and displayed as a launcher icon.<\/p><p>According to the <a href=\"https:\/\/developer.apple.com\/design\/human-interface-guidelines\/foundations\/app-icons\/\">Apple Human Interface Guidelines<\/a>, these icons should be designed as flat squares without transparency, as <a href=\"..\/iOS\/\">iOS<\/a> automatically applies a mask that rounds the corners. Developers often use tools like <a href=\"..\/ImageMagick\/\">ImageMagick<\/a> or specialized web services to generate these assets. Detailed implementation guides for web developers are available via <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/Progressive_web_apps\/How_to\/Configure_icons\">MDN Web Docs<\/a>. Providing a dedicated <a href=\"..\/apple-touch-icon-120x120.png\/\">apple-touch-icon-120x120.png<\/a> prevents the system from having to upscale a smaller <a href=\"..\/Favicon\/\">Favicon<\/a>, which would result in a blurry or pixelated appearance on high-density screens.<\/p><ul><li><a href=\"..\/apple-touch-icon-180x180.png\/\">apple-touch-icon-180x180.png<\/a><\/li><li><a href=\"..\/Web App Manifest\/\">Web App Manifest<\/a><\/li><li><a href=\"..\/Retina Display\/\">Retina Display<\/a><\/li><li><a href=\"..\/Favicon\/\">Favicon<\/a><\/li><\/ul>",
    "tags": [
        "apple",
        "ios",
        "iphone",
        "favicon",
        "retina",
        "webdev",
        "png",
        "safari",
        "iconography",
        "metadata"
    ]
}