iOS 10 GUI (iPhone)
Sketch, Photoshop, Figma, and XD templates of GUI elements found in the public release of iOS 10.
Updated October 14, 2016 · Disclaimer
Design better, faster
Some people find this file useful for mocking up apps while others use it to concept ideas or create custom interface elements that work harmoniously with those native to iOS. Whatever your use, we hope you make good stuff with it.
New to designing apps? You may want to get acquainted with some of the support documentation that Apple has put together over at developer.apple.com (login required). PDFs like the iOS HIG, UI Transition Guide, and UIKit Catalog will help you become familiar with how and when to use these elements.
Whether you work in Photoshop, Sketch, Figma, or XD, we created a file to use with each tool.
Facebook iOS 10 Light contains the stuff you use the most when designing for iOS. Most of the components there match vanilla iOS components so you can be confident designs map to the tools your engineers use. In Figma, Sketch, and XD, we’ve worked in 1x and in Photoshop at 2x. Where possible we’ve tried to make components scale across device widths.
In addition to the commonly used UI elements, Facebook iOS 10 contains a ton of elements found throughout the latest iOS release.
A special thanks to Jeff Smith, Marcos Mejia, Robin Clediere, Dan Lebowitz, J.T. Trollman, Nate Butler, Jeremy Friedland, Dean Hudson, Robert Cooper, Trevor Phillippi, Charlie Deets, Ali Griffin, Jonathan Chen, Chelsea Kim, Ryan Ma, Joseph Albanese, Eric Ertmann, Priyanka Kodikal, Pietro Schirano, Yih Liang, and Daniel Giuditta.