Apple Design Resources - Apple Developer

<!DOCTYPE html> <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr" prefix="og: http://ogp.me/ns#"> <head> <meta charset="utf-8" /> <meta name="Author" content="Apple Inc." /> <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" /> <link rel="shortcut icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" /> <link rel="mask-icon" href="/apple-logo.svg" color="#333333"> <link rel="stylesheet" href="/assets/styles/global.dist.css?01172423298" type="text/css" /> <link rel="stylesheet" href="/assets/styles/dark-mode.css?17182448067" type="text/css" media="(prefers-color-scheme: dark)" data-color-scheme="dark" /> <link rel="stylesheet" href="/assets/styles/localization.css?39172414191" type="text/css" /> <script src="/assets/scripts/lib/jquery/jquery-3.6.0.min.js?17182448067"></script> <script src="/assets/scripts/settings.js?17182448067"></script> <script src="/assets/scripts/language-locales.js?17182448067"></script> <script src="/assets/scripts/DeveloperBreadcrumbs.js?05182434080"></script> <script async src="/assets/scripts/lib/jquery/jquery.retinate.js?17182448067"></script> <script async src="/assets/scripts/global.js?17182448067"></script> <script async src="/assets/scripts/global-logout.js?17182448067"></script> <link rel="stylesheet" href="https://www.apple.com/wss/fonts?family=SF+Pro&v=2" type="text/css" /> <link rel="stylesheet" href="https://www.apple.com/wss/fonts?family=SF+Pro+Icons&v=1" type="text/css" /> <link rel="stylesheet" href="https://www.apple.com/wss/fonts?family=SF+Mono&v=2" type="text/css" /> <link rel="stylesheet" href="https://www.apple.com/wss/fonts?family=Apple+Icons&v=1" type="text/css" /> <title>Apple Design Resources - Apple Developer</title> <meta name="omni_page" content="Apple Design Resources - (English)" /> <meta name="Description" content="Design apps quickly by using Sketch, Figma, XD and Photoshop templates, preconfigured UI components, and plug-ins." /> <meta property="og:locale" content="en_US" /> <meta property="og:site_name" content="Apple Developer" /> <meta property="og:type" content="website" /> <meta property="og:image" content="https://developer.apple.com/news/images/og/design-resources-hero-og.jpg" /> <meta property="og:title" content="Apple Design Resources" /> <meta property="og:description" content="Design apps quickly by using Sketch and Photoshop templates, plug-ins, and preconfigured UI elements." /> <meta property="og:url" content="https://developer.apple.com/design/resources/" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:image" content="https://developer.apple.com/news/images/og/design-resources-hero-og-twitter.jpg" /> <meta name="twitter:description" content="Design apps quickly by using Sketch and Photoshop templates, plug-ins, and preconfigured UI elements." /> <meta name="twitter:title" content="Apple Design Resources" /> <meta name="twitter:url" content="https://developer.apple.com/design/resources/" /> <link rel="stylesheet" href="/assets/styles/chapternav.css?Thursday, 07-Mar-2024 18:48:17 GMT1" type="text/css" /> <link rel="stylesheet" href="/design/resources/styles/resources.css?Thursday, 07-Mar-2024 18:48:29 GMT1" type="text/css" /> <link rel="alternate" href="https://developer.apple.com/kr/design/resources/" hreflang="ko-KR" /> <link rel="alternate" href="https://developer.apple.com/jp/design/resources/" hreflang="ja-JP" /> <link rel="alternate" href="https://developer.apple.com/cn/design/resources/" hreflang="zh-CN" /> <link rel="alternate" href="https://developer.apple.com/design/resources/" hreflang="en" /> <link rel="canonical" href="https://developer.apple.com/design/resources/" /> </head> <body class="nav-design dmf"> <script> const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches; if (window.Settings.preferredColorScheme) { const colorTheme = (window.Settings.preferredColorScheme === 'auto') && !prefersDark ? 'light' : (window.Settings.preferredColorScheme === 'light') ? 'light' : 'dark' document.body.setAttribute('data-color-scheme', colorTheme); } else { document.body.setAttribute('data-color-scheme', prefersDark ? 'dark' : 'light'); } </script> <style> /* footer */ html body[data-color-scheme='dark'] #main section.section.section-resources.bg-alt {background-color:var(--fill-tertiary);color:var(--glyph-gray);} html body[data-color-scheme='dark'] .developer-router-links {background-color:var(--fill-tertiary);color:var(--glyph-gray);} html body[data-color-scheme='dark'] .footer {background-color:var(--fill-tertiary);color:var(--glyph-gray-tertiary);} /* body backgrounds */ body[data-color-scheme='dark'].dmf {background-color: #000;} html body[data-color-scheme='dark'].dmf .bg-alt {background-color:var(--fill-tertiary);} html body[data-color-scheme='dark'].dmf .bg-blue {background-color:var(--fill-blue-secondary);} html body[data-color-scheme='dark'].dmf .bg-green-blue {background:linear-gradient(135deg, #65976d 0%, #588ea4 100%)} html body[data-color-scheme='dark'].dmf .bg-yellow {background: linear-gradient(to bottom, var(--fill-tertiary) 0%, var(--fill-tertiary-alt) 100%);} html body[data-color-scheme='dark'].dmf .bg-light {background-color:var(--fill-secondary-alt);} html body[data-color-scheme='dark'].dmf .bg-gradient, html body[data-color-scheme='dark'].dmf .bg-grad {background:linear-gradient(to bottom, var(--dark) 0%, var(--fill-gray-secondary-alt) 100%);} html body[data-color-scheme='dark'].dmf .bg-grad-down {background:linear-gradient(to bottom, var(--dark) 0%, var(--fill-gray-secondary-alt) 100%);} html body[data-color-scheme='dark'].dmf .bg-grad-up {background:linear-gradient(to bottom, var(--fill-gray-secondary-alt) 0%, var(--dark) 100%);} html body[data-color-scheme='dark'].dmf .bg-blue-gradient, html body[data-color-scheme='dark'].dmf .bg-gradient-blue {background:linear-gradient(to bottom, var(--fill-blue-gradient-light) 0%, var(--fill-blue-gradient-dark) 100%);} html body[data-color-scheme='dark'].dmf .bg-blue-gradient-alt {background: linear-gradient(90deg, #061830 0%, #102d48 100%);} /* globalNav */ html body[data-color-scheme='dark'] #ac-globalnav {background: var(--fill-tertiary);} /* localNav */ html body[data-color-scheme='dark'] .localnav.localnav-scrim .localnav-background, html body[data-color-scheme='dark'] .localnav-scrim.localnav.localnav-background { background-color: rgba(29, 29, 31, 0.9); } @supports ((-webkit-backdrop-filter: initial) or (backdrop-filter: initial)) { html body[data-color-scheme='dark'] .localnav.localnav-scrim .localnav-background, html body[data-color-scheme='dark'] .localnav-scrim.localnav.localnav-background { background-color: rgba(29, 29, 31, 0.72); } } </style> <link rel="stylesheet" href="/assets/styles/globalnav.css?55202406207" type="text/css" /> <link rel="stylesheet" href="/assets/styles/suggest-lang.css?17182448067" type="text/css" /> <div id="suggest-lang" class="ribbon hide" lang="en"> <div class="ribbon-content-wrapper"> <div class="ribbon-content row"> <div class="column large-12 large-centered"> <p><a href="#" id="suggest-link" class="ribbon-link more">View in English</a></p> <button id="suggest-closer" class="icon icon-after icon-reset" aria-label="Dismiss language suggestion" tabindex="0"></button> </div> </div> </div> </div> <script src="/assets/scripts/suggest-lang.js?17182448067"></script> <aside id="ac-gn-segmentbar" class="ac-gn-segmentbar" lang="en-US" dir="ltr"> </aside> <input type="checkbox" id="ac-gn-menustate" class="ac-gn-menustate" /> <nav id="ac-globalnav" class="no-js" role="navigation" aria-label="Global" data-hires="false" data-analytics-region="global nav" lang="en-US" dir="ltr" data-www-domain="www.apple.com" data-store-locale="us" data-store-root-path="/us" data-store-api="/[storefront]/shop/bag/status" data-search-locale="en_US" data-search-suggestions-api="/search-services/suggestions/" data-search-defaultlinks-api="/search-services/suggestions/defaultlinks/" data-search-suggestions-enabled="false"> <div class="ac-gn-content"> <ul class="ac-gn-header"> <li class="ac-gn-item ac-gn-menuicon"> <label class="ac-gn-menuicon-label" for="ac-gn-menustate" aria-hidden="true"> <span class="ac-gn-menuicon-bread ac-gn-menuicon-bread-top"> <span class="ac-gn-menuicon-bread-crust ac-gn-menuicon-bread-crust-top"></span> </span> <span class="ac-gn-menuicon-bread ac-gn-menuicon-bread-bottom"> <span class="ac-gn-menuicon-bread-crust ac-gn-menuicon-bread-crust-bottom"></span> </span> </label> <a href="#ac-gn-menustate" role="button" class="ac-gn-menuanchor ac-gn-menuanchor-open" id="ac-gn-menuanchor-open"> <span class="ac-gn-menuanchor-label">Global Nav Open Menu</span> </a> <a href="#" role="button" class="ac-gn-menuanchor ac-gn-menuanchor-close" id="ac-gn-menuanchor-close"> <span class="ac-gn-menuanchor-label">Global Nav Close Menu</span> </a> </li> <li class="ac-gn-item ac-gn-apple"> <a class="ac-gn-link ac-gn-link-apple-developer" href="/" data-analytics-title="appledeveloper home" id="ac-gn-firstfocus-small"> <span class="ac-gn-link-text">Apple Developer</span> </a> </li> </ul> <div class="ac-gn-search-placeholder-container" role="search"> <div class="ac-gn-search ac-gn-search-small"> <a id="ac-gn-link-search-small" class="ac-gn-link" href="/search/" data-analytics-title="search" data-analytics-click="search" data-analytics-intrapage-link aria-label="Search"> <div class="ac-gn-search-placeholder-bar"> <div class="ac-gn-search-placeholder-input"> <div class="ac-gn-search-placeholder-input-text" aria-hidden="true"> <div class="ac-gn-link-search ac-gn-search-placeholder-input-icon"></div> <span class="ac-gn-search-placeholder">Search</span> </div> </div> <div class="ac-gn-searchview-close ac-gn-searchview-close-small ac-gn-search-placeholder-searchview-close"> <span class="ac-gn-searchview-close-cancel" aria-hidden="true">Cancel</span> </div> </div> </a> </div> </div> <ul class="ac-gn-list"> <li class="ac-gn-item ac-gn-apple"> <a class="ac-gn-link ac-gn-link-apple-developer" href="/" data-analytics-title="appledeveloper home" id="ac-gn-firstfocus"> <span class="ac-gn-link-text">Apple Developer</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-news"> <a class="ac-gn-link ac-gn-link-news" href="/news/" data-analytics-title="news"> <span class="ac-gn-link-text">News</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-discover"> <a class="ac-gn-link ac-gn-link-discover" href="/discover/" data-analytics-title="discover"> <span class="ac-gn-link-text">Discover</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-design"> <a class="ac-gn-link ac-gn-link-design" href="/design/" data-analytics-title="design"> <span class="ac-gn-link-text">Design</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-develop"> <a class="ac-gn-link ac-gn-link-develop" href="/develop/" data-analytics-title="develop"> <span class="ac-gn-link-text">Develop</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-distribute"> <a class="ac-gn-link ac-gn-link-distribute" href="/distribute/" data-analytics-title="distribute"> <span class="ac-gn-link-text">Distribute</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-dsupport"> <a class="ac-gn-link ac-gn-link-dsupport" href="/support/" data-analytics-title="dsupport"> <span class="ac-gn-link-text">Support</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-account"> <a class="ac-gn-link ac-gn-link-account" href="/account/" data-analytics-title="account"> <span class="ac-gn-link-text">Account</span> </a> </li> <li class="ac-gn-item ac-gn-item-menu ac-gn-search" role="search"> <a id="ac-gn-link-search" class="ac-gn-link ac-gn-link-search" href="/search/" data-analytics-title="search" data-analytics-click="search" data-analytics-intrapage-link aria-label="Search"></a> </li> </ul> <aside id="ac-gn-searchview" class="ac-gn-searchview" role="search" data-analytics-region="search"> <div class="ac-gn-searchview-content"> <div class="ac-gn-searchview-bar"> <div class="ac-gn-searchview-bar-wrapper"> <form id="ac-gn-searchform" class="ac-gn-searchform" action="/search/" method="get"> <div class="ac-gn-searchform-wrapper"> <input id="ac-gn-searchform-input" class="ac-gn-searchform-input" type="text" name="q" aria-label="Search" placeholder="Search" autocorrect="off" autocapitalize="off" autocomplete="off" spellcheck="false" role="combobox" aria-autocomplete="list" aria-expanded="true" aria-owns="quicklinks suggestions" /> <button id="ac-gn-searchform-submit" class="ac-gn-searchform-submit" type="submit" disabled aria-label="Submit Search"></button> <button id="ac-gn-searchform-reset" class="ac-gn-searchform-reset" type="reset" disabled aria-label="Clear Search"> <span class="ac-gn-searchform-reset-background"></span> </button> </div> </form> <button id="ac-gn-searchview-close-small" class="ac-gn-searchview-close ac-gn-searchview-close-small" aria-label="Cancel Search"> <span class="ac-gn-searchview-close-cancel" aria-hidden="true"> Cancel </span> </button> </div> </div> <aside id="ac-gn-searchresults" class="ac-gn-searchresults hidden" data-string-quicklinks="Quick Links" data-string-suggestions="Suggested Searches" data-string-noresults=""> <section class="ac-gn-searchresults-section ac-gn-searchresults-section-defaultlinks"> <div class="ac-gn-searchresults-section-wrapper"> <div class="search-group-checkbox hidden"><input id="group-input" type="checkbox" name="group-filter" checked>Only search within “<span id="group-search-label"></span>”</div> <h3 class="ac-gn-searchresults-header ac-gn-searchresults-animated">Quick Links</h3> <ul class="ac-gn-searchresults-list" id="defaultlinks" role="listbox"> </ul> <span role="status" class="ac-gn-searchresults-count" aria-live="polite">5 Quick Links</span> </div> </section> </aside> </div> <button id="ac-gn-searchview-close" class="ac-gn-searchview-close" aria-label="Cancel Search"> <span class="ac-gn-searchview-close-wrapper"> <span class="ac-gn-searchview-close-left"></span> <span class="ac-gn-searchview-close-right"></span> </span> </button> </aside> </div> </nav> <div class="ac-gn-blur"></div> <div id="ac-gn-curtain" class="ac-gn-curtain"></div> <div id="ac-gn-placeholder" class="ac-nav-placeholder"></div> <script src="/assets/scripts/ac-globalnav.built.js?17182448067"></script> <link rel="stylesheet" href="/assets/styles/search.css?17182448067"> <script src="/assets/scripts/search.js?17182448067"></script>  <script> /* RSID: */ var s_account="awdappledeveloper" </script> <script src="/assets/metrics/scripts/analytics.js?072620243"></script> <script> s.pageName= AC && AC.Tracking && AC.Tracking.pageName(); s.channel="www.en.developer" s.channel="www.en.developer"; /************* DO NOT ALTER ANYTHING BELOW THIS LINE ! **************/ var s_code=s.t();if(s_code)document.write(s_code) </script>  <link rel="stylesheet" property="stylesheet" href="/assets/styles/localnav.css" type="text/css" /> <input type="checkbox" id="localnav-menustate" class="localnav-menustate"/> <nav id="localnav" class="localnav localnav-scrim" data-sticky role="navigation"> <div class="localnav-wrapper"> <div class="localnav-background"></div> <div class="localnav-content"> <h2 class="localnav-title"> <a class="ac-ln-title-logo" href="/design/" data-analytics-title="product index">Design</a> </h2> <div class="localnav-menu"> <a href="#localnav-menustate" class="localnav-menucta-anchor localnav-menucta-anchor-open" id="localnav-menustate-open"> <span class="localnav-menucta-anchor-label">Open Menu</span> </a> <a href="#" class="localnav-menucta-anchor localnav-menucta-anchor-close" id="localnav-menustate-close"> <span class="localnav-menucta-anchor-label">Close Menu</span> </a> <div class="localnav-menu-tray"> <ul class="localnav-menu-items"> <li class="localnav-menu-item"> <a href="/design/" class="localnav-menu-link">Overview</a> </li> <li class="localnav-menu-item"> <a href="/design/pathway/" class="localnav-menu-link">Pathway</a> </li> <li class="localnav-menu-item"> <a href="/design/whats-new/" class="localnav-menu-link">What’s new</a> </li> <li class="localnav-menu-item"> <a href="/design/human-interface-guidelines/" class="localnav-menu-link">Guidelines</a> </li> <li class="localnav-menu-item"> <a href="/design/resources/" class="localnav-menu-link">Resources</a> </li> </ul> </div> <div class="localnav-actions"> <div class="localnav-action localnav-action-menucta" aria-hidden="true"> <label for="localnav-menustate" class="localnav-menucta"> <span class="localnav-menucta-chevron"></span> </label> </div> </div> </div> </div> </div> </nav> <label id="localnav-curtain" for="localnav-menustate"></label> <script src="/assets/scripts/ac-localnav.built.js"></script> <script type="text/javascript" src="/assets/scripts/localnav.js"></script> <main id="main" class="main" role="main"> <div class="ribbon ribbon-blue"> <div class="ribbon-drop-wrapper"> <div class="ribbon-content-wrapper"> <div class="ribbon-content row"> <div class="column large-centered"> <p><a href="/news/?id=s9s75a8k" class="ribbon-link">Design sessions, documentation, and sample code — <span class="nowrap more">all in one place</span></a></p> </div> </div> </div> </div> </div> <header role="presentation" class="section section-header"> <div class="section-content"> <div class="row"> <div class="column large-7 large-centered medium-9 small-12 text-center"> <h1 class="typography-hero-headline">Apple Design Resources</h1> <p class="typography-intro">Design apps quickly and accurately by using Figma, Sketch, and Photoshop design kits, guides, and other resources.</p> </div> </div> <nav id="chapternav" class="chapternav"> <div class="chapternav-wrapper"> <ul class="chapternav-items"> <li class="chapternav-item chapternav-item-ios"> <a class="chapternav-link" href="#ios-apps"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-ios"></figure> <span class="chapternav-label nowrap">iOS & iPadOS</span> </a> </li> <li class="chapternav-item chapternav-item-ipados"> <a class="chapternav-link" href="#macos-apps"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-macos"></figure> <span class="chapternav-label nowrap">macOS</span> </a> </li> <li class="chapternav-item chapternav-item-tvos"> <a class="chapternav-link" href="#tvos-apps"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-tvos"></figure> <span class="chapternav-label nowrap">tvOS</span> </a> </li> <li class="chapternav-item chapternav-item-macos"> <a class="chapternav-link" href="#watchos-apps"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-watchos"></figure> <span class="chapternav-label nowrap">watchOS</span> </a> </li> <li class="chapternav-item chapternav-item-visionos"> <a class="chapternav-link" href="#visionos-apps"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-visionos"></figure> <span class="chapternav-label nowrap">visionOS</span> </a> </li> <li class="chapternav-item chapternav-item-program"> <a class="chapternav-link" href="#technologies"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-tech"></figure> <span class="chapternav-label nowrap">Technologies</span> </a> </li> <li class="chapternav-item chapternav-item-app-store"> <a class="chapternav-link" href="#fonts"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-fonts"></figure> <span class="chapternav-label nowrap">Fonts</span> </a> </li> <li class="chapternav-item chapternav-item-watchos"> <a class="chapternav-link" href="#sf-symbols"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-symbols"></figure> <span class="chapternav-label nowrap">SF Symbols</span> </a> </li> <li class="chapternav-item chapternav-item-program"> <a class="chapternav-link" href="#product-bezels"> <figure class="chapternav-icon platform-icon chapternav-icon platform-icon-marketing"></figure> <span class="chapternav-label nowrap">Product Bezels</span> </a> </li> </ul> <div class="chapternav-paddles"> <button class="chapternav-paddle chapternav-paddle-left" aria-hidden="true" disabled=""></button> <button class="chapternav-paddle chapternav-paddle-right" aria-hidden="true" disabled=""></button> </div> </div> </nav> </div> </header> <section class="section section-ios section-download bg-light" id="ios-apps"> <div class="section-content"> <div class="row"> <div class="column large-12 no-padding-bottom"> <h2 class="typography-section-headline">iOS and iPadOS</h2> </div> </div> <div class="row"> <div class="column large-4 medium-6 small-12"> <div class="margin-bottom-small"> <h4>iOS 18 and iPadOS 18</h4> </div> <h5>Sketch Library</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/iOS16-Sketch-Library-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="sketch://add-library?url=https%3A%2F%2Fdeveloper.apple.com%2Fdesign%2Fdownloads%2Fsketch.rss" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">Note: Sketch must be installed to download<br />September 9, 2024<br />43.2 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <div class="margin-bottom-small"> <h4> </h4> </div> <h5>Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/iOS18-Design-Templates_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1385659531316001292/ios-18-and-ipados-18" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">June 26, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/iOS18-Design-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">September 9, 2024<br />23.5 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <div class="margin-bottom-small"> <h4> </h4> </div> <h5>Production Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/iOS18-Production-Templates_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/iOS-18-Production-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 27, 2024<br />3.2 MB</p> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1387687009990313744/ios-18-and-ipados-18-app-icon-production-templates" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">June 26, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/iOS-18-Production-Templates-Photoshop.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop</b></a> <p class="typography-caption-headline download-text-description">June 10, 2024<br />6.5 MB</p> </div> </div> </div> <hr /> <div class="row margin-top-small"> <div class="column large-4 medium-6 small-12"> <div class="margin-bottom-small"> <h4>iOS 16</h4> </div> <h5>Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/iOS16-Design-Templates-Keynote-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/iOS-16-Keynote.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Keynote</b></a> <p class="typography-caption-headline download-text-description">January 2, 2023<br />35.7 MB</p> </div> </div> </div> </div> </section> <section class="section section-macos section-download" id="macos-apps"> <div class="section-content"> <div class="row"> <div class="column large-12 no-padding-bottom"> <h2 class="typography-section-headline">macOS</h2> </div> </div> <div class="row"> <div class="column large-12 no-padding-bottom"> <h4>macOS Sequoia</h4> </div> </div> <div class="row"> <div class="column large-4 medium-6 small-12"> <h5>Sketch Library</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/macOS12-Sketch-Library-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="sketch://add-library?url=https%3A%2F%2Fdeveloper.apple.com%2Fdesign%2Fdownloads%2Fsketch-macOS.rss" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">Note: Sketch must be installed to download<br />September 9, 2024<br />37.9 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/macOS-Sequoia-Design-Templates_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/macOS-Sequoia-Design-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">September 9, 2024<br />22.9 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Production Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/macOS12-Production-Templates-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/macOS-Sequoia-Production-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />3.3 MB</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/macOS-Sequoia-Production-Templates-Photoshop.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />7.3 MB</p> </div> </div> </div> </div> </section> <section class="section section-tvos section-download bg-light" id="tvos-apps"> <div class="section-content"> <div class="row"> <div class="column large-12 no-padding-bottom"> <h2 class="typography-section-headline">tvOS</h2> </div> </div> <div class="row"> <div class="column large-12 no-padding-bottom"> <h4>tvOS 18</h4> </div> <div class="column large-4 medium-6 small-12"> <h5>Sketch Library</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/tvOS14-Sketch-Library-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="sketch://add-library?url=https%3A%2F%2Fdeveloper.apple.com%2Fdesign%2Fdownloads%2Fsketch-tvOS.rss" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">Note: Sketch must be installed to download<br />September 9, 2024<br />9.4 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/tvOS18-Design-Templates_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/tvOS18-Design-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">September 9, 2024<br />10 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Production Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/tvOS14-Production-Templates-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/tvOS-16-Production-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">February 15, 2023<br />1.3 MB</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/tvOS-16-Production-Templates-Photoshop.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop</b></a> <p class="typography-caption-headline download-text-description">February 15, 2023<br />1.6 MB</p> </div> </div> </div> </div> </section> <section class="section section-visionos section-download" id="visionos-apps"> <div class="section-content"> <div class="row"> <div class="column large-12 no-padding-bottom"> <h2 class="typography-section-headline">visionOS</h2> </div> </div> <div class="row"> <div class="column large-4 medium-6 small-12"> <h5>Library</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/visionOS-2-Design-Templates_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1253443272911187215/apple-design-resources-visionos" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">October 17, 2024 (visionOS 2)</p> </div> <div class="row row-download"> <a href="sketch://add-library?url=https%3A%2F%2Fdeveloper.apple.com%2Fdesign%2Fdownloads%2Fsketch-visionOS.rss" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">Note: Sketch must be installed to download<br />September 9, 2024<br />32.7 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/visionOS-Design-Templates-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/visionOS-Design-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />34.9 MB</p> </div> </div> </div> </div> </section> <section class="section section-watchos section-download bg-light" id="watchos-apps"> <div class="section-content"> <div class="row"> <div class="column large-12 no-padding-bottom"> <h2 class="typography-section-headline">watchOS</h2> </div> </div> <div class="row"> <div class="column large-12 no-padding-bottom"> <h4>watchOS 10</h4> </div> <div class="column large-4 medium-6 small-12"> <h5>Sketch Library</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/watchOS8-Sketch-Library-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="sketch://add-library?url=https%3A%2F%2Fdeveloper.apple.com%2Fdesign%2Fdownloads%2Fsketch-watchOS.rss" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">Note: Sketch must be installed to download<br />July 12, 2023<br />5.4 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/watchOS10-Design-Templates_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/watchOS-10-Design-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">July 12, 2023<br />6.9 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Production Templates</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/watchOS8-Production-Templates-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/watchOS-10-Production-Templates-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 7, 2023<br />1.2 MB</p> </div> </div> </div> </div> </section> <section class="section section-technologies section-download" id="technologies"> <div class="section-content"> <div class="row"> <div class="column large-6 small-12 padding-bottom-small"> <h2 class="typography-section-headline">Technologies</h2> </div> </div> <div class="row"> <div class="column large-4 medium-6 small-12"> <h5>Add Apple Watch Face</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Apply-Apple-Watch-Face-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Glyph-Add-Apple-Watch-Face.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PNG, PDF, SVG</b></a> <p class="typography-caption-headline download-text-description">October 22, 2021<br />1.8 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>AirPlay</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-AirPlay-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Glyph-AirPlay.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PDF</b></a> <p class="typography-caption-headline download-text-description">October 22, 2021<br />1.1 MB</p> </div> <div class="row row-download"> <a href="/design/human-interface-guidelines/technologies/airplay/introduction/" class="download-text-link list-icon-document"><b>Design Guidelines</b></a> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>App Clips Design Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-App-Clips_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367914571662801866/app-clips" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-App-Clips-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />2.6 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Health Icon</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Apple-Health-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Logo-Apple-Health.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PNG</b></a> <p class="typography-caption-headline download-text-description">October 22, 2021<br />1.3 MB</p> </div> <div class="row row-download"> <a href="/design/human-interface-guidelines/healthkit/" class="download-text-link list-icon-document"><b>Design Guidelines</b></a> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Pay Design Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Apple-Pay-iOS16_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367915141082663884/apple-pay" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-Apple-Pay-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />1.7 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>ARKit Badge and Glyph</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-ARKit-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Glyph-ARKit.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PDF</b></a> <p class="typography-caption-headline download-text-description">October 22, 2021<br />1.1 MB</p> </div> <div class="row row-download"> <a href="/design/human-interface-guidelines/ios/system-capabilities/augmented-reality/" class="download-text-link list-icon-document"><b>Design Guidelines</b></a> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Camera Control Design Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Thumbnail-Tech-CameraControl_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-CameraControl-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">September 9, 2024<br />1.6 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Game Center Icon and Glyphs</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Game-Center-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Logo-Game-Center.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PDF</b></a> <p class="typography-caption-headline download-text-description">October 22, 2021<br />1.3 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>HomeKit Icon and Glyph</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-HomeKit-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Logo-HomeKit.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PNG, PDF</b></a> <p class="typography-caption-headline download-text-description">October 22, 2021<br />1.2 MB</p> </div> <div class="row row-download"> <a href="/design/human-interface-guidelines/technologies/homekit/introduction/" class="download-text-link list-icon-document"><b>Design Guidelines</b></a> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Live Activities Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Live-Activities_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367915437752334285/live-activities" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-Live-Activities-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />10.7 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5 class="title-height-large">Messages Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Messages-iOS16_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367916269438172112/imessage-apps-and-stickers" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-Messages-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />2.9 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5 class="title-height">Messages for Business Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-MFB-iOS16_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-MFB-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">January 19, 2023<br />3.5 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5 class="title-height-large">Sign in with Apple</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Sign-in-with-Apple-Logos-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Logo-Sign-in-with-Apple.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PNG, PDF, SVG</b></a> <p class="typography-caption-headline download-text-description">October 22, 2021<br />1.1 MB</p> </div> <div class="row row-download"> <a href="/design/human-interface-guidelines/technologies/sign-in-with-apple/introduction/" class="download-text-link list-icon-document"><b>Design Guidelines</b></a> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Sign in with Apple Buttons</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/iOS15-sign-in-with-Apple-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367916685468040146/sign-in-with-apple" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-SIWA-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />1.3 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Siri and App Shortcuts Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Siri-App-Shortcuts_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367916969551216595/siri-app-shortcuts" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-Siri-App-Shortcuts-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />8.2 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Siri Icons</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/iOS15-Siri-orb_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Logo-Siri.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>PNG</b></a> <p class="typography-caption-headline download-text-description">July 8, 2022<br />5.4 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Tap to Pay Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-TTP-iOS16_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367917199004804052/tap-to-pay-on-iphone" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-Tap-to-Pay-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024<br />2.1 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>TipKit Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-TipKit_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367917705471226837/tipkit" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-TipKit-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024<br />6.1 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Wallet Template</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Technologies-Wallet_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://www.figma.com/community/file/1367917956770293718/wallet" class="download-text-link"><span class="icon icon-before icon-external icon-blue"></span><b>Figma</b></a> <p class="typography-caption-headline download-text-description">May 2, 2024</p> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Tech-Design-Template-Wallet-Sketch.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">June 12, 2024<br />6 MB</p> </div> </div> </div> </div> </section> <section class="section section-technologies section-download bg-light" id="fonts"> <div class="section-content"> <div class="row"> <div class="column large-6 small-12 padding-bottom-small"> <h2 class="typography-section-headline">Fonts</h2> </div> </div> <div class="row"> <div class="column large-4 medium-6 small-12"> <h5>SF Pro</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-SF-Pro-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Pro.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download SF Pro</b></a> <p class="typography-caption-headline download-text-description">System font for iOS, iPad OS, macOS and tvOS.</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>SF Compact</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-SF-Compact-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Compact.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download SF Compact</b></a> <p class="typography-caption-headline download-text-description">System font for watchOS, optimized for small sizes and narrow columns.</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>SF Mono</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-SF-Mono-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Mono.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download SF Mono</b></a> <p class="typography-caption-headline download-text-description">Used in Xcode, enables alignment between rows and columns of text.</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>New York</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-New-York-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/NY.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download New York</b></a> <p class="typography-caption-headline download-text-description">Performs as a traditional reading face at small sizes and a graphic display face at larger sizes.</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>SF Arabic</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-SF-Arabic-beta-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Arabic.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download SF Arabic</b></a> <p class="typography-caption-headline download-text-description">Arabic system font on Apple platforms.</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>SF Armenian</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-SF-Armenian-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Armenian.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download SF Armenian</b></a> <p class="typography-caption-headline download-text-description">Designed with proportions that have been adjusted for a better visual balance in multilingual typesetting.</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>SF Georgian</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-SF-Georgian-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Georgian.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download SF Georgian</b></a> <p class="typography-caption-headline download-text-description">Supports modern Georgian, Mkhedruli, and Mtavruli uppercase forms.</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>SF Hebrew</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Fonts-SF-Hebrew-small_2x.png?2" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Hebrew.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download SF Hebrew</b></a> <p class="typography-caption-headline download-text-description">With full support of the Niqqud diacritical marks.</p> </div> </div> </div> </div> </section> <section class="section section-sf-symbols section-download" id="sf-symbols"> <div class="section-content"> <div class="row align-items-center"> <div class="column large-12 no-padding-bottom"> <h2 class="typography-section-headline">SF Symbols</h2> </div> <div class="column large-12 small-12"> <p>SF Symbols is a library of over 6,000 symbols that are designed to integrate seamlessly with San Francisco, the system font for Apple platforms. Symbols come in nine weights and three scales, automatically align with text, and can be exported and edited using vector graphics editing tools to create custom symbols with shared design characteristics and accessibility features. SF Symbols 6 brings new and enhanced animations, updated annotation tools, and over 800 new symbols.</p> </div> <div class="column large-4 medium-6 small-12 download-column-text"> <div class="download"> <img class="image-file" src="/assets/elements/icons/sf-symbols-2/sf-symbols-2-48x48_2x.png" width="48" height="48" alt="" /> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Symbols-6.dmg"><span class="icon icon-after icon-downloadcircle">Download SF Symbols 6</span></a> <p class="typography-caption">September 27, 2024<br />Requires macOS Ventura or later. (385.4 MB)</p> </div> <div class="download"> <img class="image-file" src="/assets/elements/icons/sf-symbols-2/sf-symbols-2-48x48_2x.png" width="48" height="48" alt="" /> <a href="https://devimages-cdn.apple.com/design/resources/download/SF-Symbols-5.1.dmg"><span class="icon icon-after icon-downloadcircle">Download SF Symbols 5.1</span></a> <p class="typography-caption">January 16, 2024<br />Requires macOS Monterey or later. (298 MB)</p> </div> </div> <div class="column large-8 medium-6 small-12 download-column"> <figure class="image-sf-symbols"></figure> </div> </div> </div> </section> <section class="section section-technologies section-download bg-light" id="parallax-previewer"> <div class="section-content"> <div class="row"> <div class="column large-12 small-12 padding-bottom-small"> <h2 class="typography-section-headline">Parallax image tools</h2> <p>Use Parallax Previewer and Parallax Exporter Plug-In for Adobe Photoshop to deliver parallax visual effects that transform static images into dynamic and immersive experiences on tvOS and visionOS.</p> </div> </div> <div class="row"> <div class="column large-4 medium-6 small-12"> <h5 class="title-height margin-bottom-small">Parallax Previewer App</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/tvOS-Parallax-Previewer-App-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://itunespartner.apple.com/assets/downloads/Parallax%20Previewer.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download version 2 for macOS</b></a> <p class="typography-caption-headline download-text-description">Requires macOS 13.5 or later.</p> </div> <div class="row row-download"> <a href="https://itunespartner.apple.com/assets/downloads/Parallax%20Previewer_1_0.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download version 1 for macOS</b></a> <p class="typography-caption-headline download-text-description">Requires macOS 10.10.5 or later.</p> </div> <div class="row row-download"> <a href="https://help.apple.com/itc/parallaxpreviewer/" class="download-text-link list-icon-document"><b>User Guide</b></a> </div> </div> <div class="column large-4 medium-6 small-12"> <h5 class="title-height margin-bottom-small">Parallax Exporter Plug-In for Adobe Photoshop</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/tvOS-Parallax-Previewer-plugin-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://itunespartner.apple.com/assets/downloads/ParallaxExporter_Apps.zip" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download for macOS</b></a> <p class="typography-caption-headline download-text-description">Requires Adobe Photoshop 2023 (v24.1) or later and macOS 12.4.0 or later.</p> </div> <div class="row row-download"> <a href="https://itunespartner.apple.com/assets/downloads/ParallaxExporter_Windows.zip" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Download for Windows</b></a> <p class="typography-caption-headline download-text-description">Requires Adobe Photoshop 2023 (v24.1) or later and Microsoft Windows 10 64-bit (version 22H2) or later.</p> </div> </div> </div> </div> </section> <section class="section section-technologies section-download" id="product-bezels"> <div class="section-content"> <div class="row"> <div class="column large-12 small-12 padding-bottom-small"> <h2 class="typography-section-headline">Product Bezels</h2> <p>When using product bezels in your marketing materials, be sure to review these <a href="/app-store/marketing/guidelines/#section-products">Marketing Resources and Identity Guidelines</a>.</p> </div> </div> <div class="row"> <div class="column large-4 medium-6 small-12"> <h5>All Product Bezels</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-All-Hardware-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="sketch://add-library?url=https%3A%2F%2Fdeveloper.apple.com%2Fdesign%2Fdownloads%2Fsketch-bezels.rss" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Sketch</b></a> <p class="typography-caption-headline download-text-description">Note: Sketch must be installed to download<br />May 8, 2024<br />71.7 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple TV</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-AppleTV-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-TV.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />31.7 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Ultra 2 (2024)</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Thumbnail-Bezel-AppleWatchUltra2-2024_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Ultra-2-2024.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">September 9, 2024<br />95.2 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Ultra 2</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-AppleWatchUltra2-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Ultra-2.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">November 17, 2023<br />72.8 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Ultra</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-AppleWatchUltra-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Ultra.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">February 7, 2023<br />68.2 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Series 10</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Thumbnail-Bezel-AppleWatchSeries10_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Series-10.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">September 9, 2024<br />98.4 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Series 9</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-AppleWatchSeries9-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Series-9.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">November 17, 2023<br />293.3 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Series 8</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-AppleWatchSeries8-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Series-8.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">September 15, 2022<br />10.2 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Series 7</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-AppleWatchSeries7-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Series-7.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />7.8 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>Apple Watch Series 6</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-AppleWatchSeries6-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-Apple-Watch-Series-6.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />5.6 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iMac 24"</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iMac24-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iMac24.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />27.8 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPad</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPad-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPad.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />5.1 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPad Air</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPadAir-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPad-Air-M2.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">May 8, 2024<br />13 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPad mini</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPadMini-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPad-mini.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />4.9 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPad Pro</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPadPro-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPad-Pro-M4.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">May 8, 2024<br />7.6 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPhone 16</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Thumbnail-Bezel-iPhone16_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPhone-16.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">September 9, 2024<br />273 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPhone 15</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPhone15-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPhone-15.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">September 13, 2023<br />241 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPhone 14</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPhone14-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPhone-14.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">June 12, 2023<br />35.6 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPhone 13</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPhone13-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPhone-13.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />758.5 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPhone 12</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPhone12-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPhone-12.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />8.7 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPhone 11</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPhone11-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPhone-11.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />12.8 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>iPhone 12 Pro and iPad Pro</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-iPhone12-iPadPro12.9-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-iPhone-12-Pro-iPad-Pro-12.9.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />15.5 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>MacBook Air</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-MacBook-Air-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-MacBook-Air-13-4th-Gen.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">July 27, 2022<br />15.7 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>MacBook Pro 4th Gen</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-MacBook-Pro-4thGen-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-MacBook-Pro-4th-Gen.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />9.2 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>MacBook Pro 4th Gen (Touch Bar)</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-MacBook-Pro-4thGen-TouchBar-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-MacBook-Pro-4th-Gen-Touch-Bar.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />56.4 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5>MacBook Pro 5th Gen</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-MacBook-Pro-5thGen-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Bezel-MacBook-Pro-5th-Gen.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Photoshop, PNG</b></a> <p class="typography-caption-headline download-text-description">January 5, 2022<br />26 MB</p> </div> </div> <div class="column large-4 medium-6 small-12"> <h5 class="nowrap">iPhone and iPad for Keynote Live Video</h5> <div class="download-image-container"> <picture> <img src="/design/resources/images/thumbnails/Bezel-Keynote-small_2x.png" width="100%" class="download-image" alt="" /> </picture> </div> <div class="row row-download"> <a href="https://devimages-cdn.apple.com/design/resources/download/Keynote-Live-Video-Product-Bezel.dmg" class="download-text-link"><span class="icon icon-before icon-downloadcircle icon-blue"></span><b>Keynote</b></a> <p class="typography-caption-headline download-text-description">September 15, 2022<br />11.1 MB</p> </div> </div> </div> </div> </section> <section class="section bg-alt"> <div class="section-content"> <div class="row"> <div class="column large-6 small-12"> <h2 class="typography-section-headline">Badges and Logos</h2> <p>Find badges and logos for Apple technologies, such as Apple Health, Apple Wallet, Apple Music, and Apple Pay, that can be used in your app’s marketing material.</p> <a href="/softwarelicensing/" class="more">View Apple Badges and Logos<span class="loc-en-only"></span></a> </div> <div class="column large-5 small-8 large-offset-1 small-offset-0"> <picture> <img src="/design/resources/images/thumbnails/Marketing-Imagery-Badges_2x.png" width="100%" style="border-radius: 10px" alt="" /> </picture> </div> </div> </div> </section> </main> <link rel="stylesheet" href="/assets/styles/footer.dist.css?17182448067"> <footer id="footer" class="footer" role="contentinfo" aria-labelledby="footer-label"> <div class="footer-content"> <h2 class="footer-label" id="footer-label">Developer Footer</h2> <developer-breadcrumbs> <li><a href="/design/">Design</a></li> <li>Resources</li> </developer-breadcrumbs> <nav class="footer-directory" aria-label="Apple Developer Directory" role="navigation">  <div class="footer-directory-column"> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-platform" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-platform"> <h3 class="footer-directory-column-section-title">Platforms</h3> </label> <a href="#footer-directory-column-section-state-platform" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/ios/">iOS</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/ipados/">iPadOS</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/macos/">macOS</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/tvos/">tvOS</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/visionos/">visionOS</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/watchos/">watchOS</a></li> </ul> </div> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-tools" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-tools"> <h3 class="footer-directory-column-section-title">Tools</h3> </label> <a href="#footer-directory-column-section-state-tools" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/swift/">Swift</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/swiftui/">SwiftUI</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/swift-playgrounds/">Swift Playgrounds</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/testflight/">TestFlight</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/xcode/">Xcode</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/xcode-cloud/">Xcode Cloud</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/sf-symbols/">SF Symbols</a></li> </ul> </div> </div> <div class="footer-directory-column"> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-topics" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-topics"> <h3 class="footer-directory-column-section-title">Topics & Technologies</h3> </label> <a href="#footer-directory-column-section-state-topics" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/accessibility/">Accessibility</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/accessories/">Accessories</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/app-extensions/">App Extensions</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/app-store/">App Store</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/audio/">Audio & Video</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/augmented-reality/">Augmented Reality</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/design/">Design</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/distribute/">Distribution</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/education/">Education</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/fonts/">Fonts</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/games/">Games</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/health-fitness/">Health & Fitness</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/in-app-purchase/">In-App Purchase</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/localization/">Localization</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/maps/">Maps & Location</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/machine-learning/">Machine Learning</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="https://opensource.apple.com">Open Source</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/security/">Security</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/safari/">Safari & Web</a></li> </ul> </div> </div> <div class="footer-directory-column"> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-resources" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-resources"> <h3 class="footer-directory-column-section-title">Resources</h3> </label> <a href="#footer-directory-column-section-state-resources" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/documentation/">Documentation</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/learn/">Tutorials</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/download/">Downloads</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/forums/">Forums</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/videos/">Videos</a></li> </ul> </div> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-support" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-support"> <h3 class="footer-directory-column-section-title">Support</h3> </label> <a href="#footer-directory-column-section-state-support" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/support/articles/">Support Articles</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/contact/">Contact Us</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/bug-reporting/">Bug Reporting</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/system-status/">System Status</a></li> </ul> </div> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-account" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-account"> <h3 class="footer-directory-column-section-title">Account</h3> </label> <a href="#footer-directory-column-section-state-account" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/account/">Apple Developer</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="https://appstoreconnect.apple.com/">App Store Connect</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/account/ios/certificate/">Certificates, IDs, & Profiles</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="https://feedbackassistant.apple.com/">Feedback Assistant</a></li> </ul> </div> </div> <div class="footer-directory-column"> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-programs" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-programs"> <h3 class="footer-directory-column-section-title">Programs</h3> </label> <a href="#footer-directory-column-section-state-programs" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/programs/">Apple Developer Program</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/programs/enterprise/">Apple Developer Enterprise Program</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/app-store/small-business-program/">App Store Small Business Program</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="https://mfi.apple.com/">MFi Program</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/programs/news-partner/">News Partner Program</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/programs/video-partner/">Video Partner Program</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/security-bounty/">Security Bounty Program</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/programs/security-research-device/">Security Research Device Program</a></li> </ul> </div> <input class="footer-directory-column-section-state" type="checkbox" id="footer-directory-column-section-state-events" /> <div class="footer-directory-column-section"> <label class="footer-directory-column-section-label" for="footer-directory-column-section-state-events"> <h3 class="footer-directory-column-section-title">Events</h3> </label> <a href="#footer-directory-column-section-state-events" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-open"> <span class="footer-directory-column-section-anchor-label">Open Menu</span> </a> <a href="#" class="footer-directory-column-section-anchor footer-directory-column-section-anchor-close"> <span class="footer-directory-column-section-anchor-label">Close Menu</span> </a> <ul class="footer-directory-column-section-list"> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/events/">Meet with Apple</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/events/developer-centers/">Apple Developer Centers</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/app-store/app-store-awards/">App Store Awards</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/design/awards/">Apple Design Awards</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/academies/">Apple Developer Academies</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/entrepreneur-camp/">Entrepreneur Camp</a></li> <li class="footer-directory-column-section-item"><a class="footer-directory-column-section-link" href="/wwdc/">WWDC</a></li> </ul> </div> </div>  </nav> <section class="footer-mini" vocab="http://schema.org/" typeof="Organization"> <div class="footer-mini-news"> <div class="copy"> Get the <a href="https://apps.apple.com/us/app/apple-developer/id640199958">Apple Developer app</a>. </div> <div class="content"> <div class="color-scheme-toggle" role="radiogroup" tabindex="0" aria-label="Select a color scheme preference"> <label data-color-scheme-option="light"> <input type="radio" value="light" autocomplete="off" onchange="window.setPreferredColorScheme(event.target.value)" /> <div class="text">Light</div> </label> <label data-color-scheme-option="dark"> <input type="radio" value="dark" autocomplete="off" onchange="window.setPreferredColorScheme(event.target.value)" /> <div class="text">Dark</div> </label> <label data-color-scheme-option="auto"> <input type="radio" value="auto" autocomplete="off" onchange="window.setPreferredColorScheme(event.target.value)" /> <div class="text">Auto</div> </label> </div> <script async src="/assets/scripts/color-scheme-toggle.js"></script> </div> </div> <link rel="stylesheet" href="/assets/styles/language-dropdown.css?17182448067"> <div class="language-dropdown dropdown-container legacy-form hidden"> <select class="dropdown" aria-label="Language Dropdown"></select> <span class="dropdown-icon icon icon-chevrondown" aria-hidden="true"></span> </div> <script src="/assets/scripts/language-dropdown.js?17182448067"></script> <div class="footer-mini-legal"> <div class="footer-mini-legal-copyright">Copyright © 2024 <a href="https://www.apple.com">Apple Inc.</a> All rights reserved.</div> <div class="footer-mini-legal-links"> <a class="footer-mini-legal-link" href="https://www.apple.com/legal/internet-services/terms/site.html" class="first">Terms of Use</a> <a class="footer-mini-legal-link" href="https://www.apple.com/legal/privacy/">Privacy Policy</a> <a class="footer-mini-legal-link" href="/support/terms/">Agreements and Guidelines</a> </div> </div> </section> </div> </footer> <script src="/assets/scripts/chapternav.js"></script> </body> </html>

CINXE.COM

Apple Design Resources - Apple Developer