UI设计中不同手机尺寸和模板大合集！
更新时间：2024-04-30 11:25:10
对于一名 UI 设计师来说，了解尺寸规范是必不可少的。精确掌握和应用各种尺寸规范确实是关键的一环，因为这影响到用户界面的功能性、美观性和用户体验。不同手机尺寸一般是多少？今天本文就为大家带来了 UI 设计中不同手机尺寸和模板大合集！iPhone 手机 UI 设计尺寸、Android 手机 UI 设计尺寸、iPad UI 设计尺寸和 UI 界面设计字体规范，文中还附有免费使用的设计模板链接，赶紧往下看吧！
点击图片，免费使用同款设计模板👇
1、iPhone 手机 UI 设计尺寸
- iPhone X (@2x)
分辨率：750 × 1624(PX)
状态栏：88(PX)
导航栏：88(PX)
标签栏：98(PX)+68(PX)
- iPhone 6/7/8
分辨率：750 × 1334(PX)
状态栏：40(PX)
导航栏：88(PX)
标签栏：98(PX)
- iPhone X/XS
分辨率：1125 × 2436(PX)
状态栏：132(PX)
导航栏：132(PX)
标签栏：147(PX)
点击图片，免费使用同款设计模板👇
- iPhone 5/5S/5C
分辨率：640 x 1136 (PX)
状态栏：40(PX)
导航栏：88(PX)
标签栏：98(PX)
- iPhone 6P/7P/8P
分辨率：1242 x 2208(PX)
状态栏：60(PX)
导航栏：132(PX)
标签栏：147(PX)
- iPhone 4/4S
分辨率：640 x 960(PX)
状态栏：40(PX)
导航栏：88(PX)
标签栏：98(PX)
- 应用图标尺寸输出
1024x1024 (PX) 180x180 (PX) 120x120 (PX) 87x87 (PX)
80x80 (PX) 60x60 (PX) 58x58 (PX) 40x40 (PX) 29x29(PX)
2、Android 手机 UI 设计尺寸
- Android 1
分辨率：320 × 480(PX)
状态栏：40(PX)
导航栏：88(PX)
标签栏：98(PX)
- Android 2
分辨率：480 × 800(PX)
状态栏：40(PX)
导航栏：88(PX)
标签栏：98(PX)
- Android 3
分辨率：540×960(PX)
状态栏：40(PX)
导航栏：88(PX)
标签栏：98(PX)
- Android 4
分辨率：720 × 1280(PX)
状态栏：50(PX)
导航栏：96(PX)
标签栏：96(PX)
- Android 5
分辨率：1080 × 1920(PX)
状态栏：75(PX)
导航栏：144(PX)
标签栏：144(PX)
- Android 6
分辨率：1140 × 2560(PX)
状态栏：100(PX)
导航栏：192(PX)
标签栏：192 (PX)
- 应用图标尺寸输出
192 × 192 (PX) 144 × 144 (PX) 96 × 96 (PX) 72 × 72 (PX) 48 × 48 (PX)
3、iPad UI 设计尺寸
- iPad 3/4/5/6/Air/mini2
分辨率：2048 x 1536(PX)
状态栏：40(PX)
导航栏：88(PX)
标签栏：98(PX)
分辨率：264(PPI)
- iPad Mini
分辨率：1024 × 768 (PX)
状态栏：20(PX)
导航栏：44(PX)
标签栏：49(PX)
分辨率：163(PPI)
- iPad 1/2
分辨率：1024 × 768(PX)
状态栏：20(PX)
导航栏：44(PX)
标签栏：49(PX)
分辨率：132(PPI)
- 应用图标尺寸输出
167 × 167 (PX)
152 × 152 (PX)
76 × 76 (PX)
4、UI 界面设计字体规范
- IOS 字体
中文：苹方
英文：San Francisco Pro
- Android 字体
5.0 以上版本：思源黑体/NotoSansHan
5.0 以下版本：Droid SansFallback
英文/数字：Roboto
- 字体大小
导航栏：32-36(PX)
标签栏：20(PX)
内容：2-6(PX)的阶梯
5、最后
以上就是今天本文和大家分享的 UI 设计中不同手机尺寸和模板大合集，掌握这些尺寸规范不仅能帮助设计师创建更有效的设计，也有助于提升设计的专业性和实用性，最终提升用户的满意度和使用效率。在日常工作中，UI 设计师需要通过持续学习、实践和测试，来不断完善自己对尺寸规范的理解和应用。即时设计作为国产优秀的 UI 设计工具，内置的设计模板和强大的设计功能，都能帮助设计师更加快速的完成工作！
点击图片，立即体验即时设计社区👇
