[ 자기개발 ]/개발에 필요한 정보 정리

스크랩 - iCon Size [ Navigation Bar, Tab Bar ]

스밤바 2020. 4. 10. 13:27

Navigation Bar and Toolbar Icon Size

Use the following sizes for guidance when preparing custom navigation bar and toolbar icons, but adjust as needed to create balance.

Target sizesMaximum sizes

72px × 72px (24pt × 24pt @3x) 84px × 84px (28pt × 28pt @3x)
48px × 48px (24pt × 24pt @2x) 56px × 56px (28pt × 28pt @2x)

Tab Bar Icon Size

In portrait orientation, tab bar icons appear above tab titles. In landscape orientation, the icons and titles appear side-by-side. Depending on the device and orientation, the system displays either a regular or compact tab bar. Your app should include custom tab bar icons for both sizes.

Target width and height (circular glyphs)

Regular tab barsCompact tab bars

75px × 75px (25pt × 25pt @3x) 54px × 54px (18pt × 18pt @3x)
50px × 50px (25pt × 25pt @2x) 36px × 36px (18pt × 18pt @2x)

Target width and height (square glyphs)

Regular tab barsCompact tab bars

69px × 69px (23pt × 23pt @3x) 51px × 51px (17pt × 17pt @3x)
46px × 46px (23pt × 23pt @2x) 34px × 34px (17pt × 17pt @2x)

Target width (wide glyphs)

Regular tab barsCompact tab bars

93px (31pt @3x) 69px (23pt @3x)
62px (31pt @2x) 46px (23pt @2x)

Target height (tall glyphs)

Regular tab barsCompact tab bars

84px (28pt @3x) 60px (20pt @3x)
56px (28pt @2x) 40px (20pt @2x)

 

 

스크랩 : https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/custom-icons/