当前位置:
文档之家› ui设计尺寸规范-最全ui设计规范
ui设计尺寸规范-最全ui设计规范
PPI
401PPI 326PPI 326PPI 326PPI 163PPI
状态栏高度 导航栏高度 标签栏高度
60px
132px
40px
88px
40px
88px
40px
88px
146px 98px 98px 98px
20px
44px
49px
iPhone 图标尺寸:
设备
App Store
程序应用
主屏幕 Spotlight 搜索 标签栏 工具栏和导航栏
索尼 Xperia Z3 HTC Desire 820
OPPO Find 7 OPPO R3 小米 M4 小米 M3 小米 M3S
华为荣耀 6
英寸 英寸 英寸 5 英寸 5 英寸 5 英寸 5 英寸 5 英寸
1080×1920 px 720×1280 px 1440×2560 px 720×1280 px 1080×1920 px 1080×1920 px 1080×1920 px 1080×1920 px
1024×1024 px
iPad Mini
1024×1024 px
程序应用
180×180 px
90×90 px
90×90 px
主屏幕 Spotlight 搜索 标签栏
工具栏\ 导航栏
144×144 px
100×100 px
50×50 px
44×44 px
72×72 px
72×72 px
50×50 px
滚动条
15 px
市场份额 (国内浮动)
%
15 px
1%
15 px
34%
15 px
28%
15 px
1%
15 px
%
系统分辨率统计
分辨率 1920×1080
360×640 720×1280 320×568 1080×1920
占有率
% % % % %
ห้องสมุดไป่ตู้
分辨率 1366×768 1440×900 1024×768 1600×900 375×667
iPhone6P - 6SP 7(@3×)
iPhone6 - 6S 7 (@2×)
iPhone5 - 5C 5S (@2×)
1024×1024 px
1024×1024 px
1024×1024 px
180×180 px
120×120 px
120×120 px
114×114 px
114×114 px
114×114 px
480×640
WVGA800(480×800) WVGA854(480×854)
600×1024
超高密度(320)
640×960
大屏幕 超大屏幕
WVGA800 * (480×800)
WVGA854 * (480×854)
1024×600
WVGA800 *(480×800) WVGA854 *(480×854)
分辨率
状态栏高度
导航栏高度
标签栏高度
264PPI
40px
88px
98px
132PPI 163PPI
20px 20px
44px 44px
49px 49px
iPad 图标尺寸:
设备
App Store
iPad 3 - 4 - 5 - 6 - Air - Air2 - mini2
1024×1024 px
iPad 1 - 2
比率 rate (针对 750px)
xhdpi xxhdpi
720×1280 1080×1920
主流 Android 手机分辨率和尺寸
设备
分辨率
尺寸
英寸 魅族 MX2
英寸 魅族 MX4
英寸 三星 GALAXY Note 4
英寸 三星 GALAXY S5
800×1280 px 1152×1920 px 1440×2560 px 1080×1920 px
24×24 dp 72×72 px
最细笔画
不小于 2 px
不小于 3 px
不小于 2 dp 不小于 6 px
Android 安卓系统 dp/sp/px 换算表
名称 idpi mdpi hdpi
分辨率
240×320 320×480 480×800
比率 rate (针对 320px)
1
比率 rate (针对 640px)
设备
魅族 MX3 魅族 MX4 Pro 未上市 三星 GALAXY Note 3 三星 GALAXY Note II
分辨率
英寸 英寸 英寸 英寸
英寸 索尼 XL39h
HTC One M8 OPPO N1
OPPO N1 Mini 小米红米 Note
小米红米 1S 小米 M2S 锤子 T1
英寸 英寸 5 英寸 英寸 英寸 英寸 英寸
占有率
% % % % %
1024×1024 px
120×120 px
57×57 px
29×29 px
38×38 px
30×30 px
iPad 的设计尺寸
设备
尺寸
iPad 3 - 4 - 5 - 6 – Air - Air2 - mini2
iPad 1 - 2
iPad Mini
2048×1536 px 1024×768 px 1024×768 px
OnePlus One
英寸
1080×1920 px
主流浏览器的界面参数与份额
浏览器
状态栏
Chrome 浏览器 火狐浏览器 IE 浏览器 360 浏览器 遨游浏览器 搜狗浏览器
22 px(浮动出现) 20 px 24 px 24 px 24 px 25 px
菜单栏
60 px 132 px 120 px 140 px 147 px 163 px
600x1024
1024×768 1280×768WXGA (1280×800)
1536×1152 1920×1152 1920×1200
2048×1536 2560×1600
Android 的图标尺寸
屏幕大小 320×480 px
480×800px 480×854px 540×960px
720×1280 px
50×50 px
25×25 px
25×25 px
22×22 px
22×22 px
Android SDK 模拟机的尺寸
屏幕大小 小屏幕
普通屏幕
低密度(120)
QVGA(240×320)
WQVGA400 (240×400)
WQVGA432 (240×432)
中等密度(160)
HVGA(320×480)
高密度(240)
尺寸
1080×1280 px
1536×2560 px
1080×1920 px
720×1280 px
1080×1920 px
1080×1920 px
1080×1920 px
720×1280 px
720×1280 px
720×1280 px
720×1280 px
1080×1920 px
LG G3
英寸
1440×2560 px
iPhone 界面尺寸
UI 设计规范:IOS、Android 系统主流尺寸整理
设备
iPhone6P、6SP、7P iPhone6 - 6S - 7 iPhone5 - 5C - 5S
iPhone4 - 4S
iPhone & iPod Touch 第一代、第二代、第三代
分辨率
1242×2208 px 750×1334 px 640×1136 px 640×960 px 320×480 px
87×87 px
58×58 px
58×58 px
75×75 px
75×75 px
75×75 px
66×66 px 44×44 px 44×44 px
iPhone4 - 4S (@2×)
1024×1024 px
120×120 px
114×114 px
58×58 px
75×75 px
44×44 px
iPhone & iPod Touch 第一代、 第二代、第三代
1080×1920 px
启动图标
48×48 px
72×72 px
48×48 dp 144×144 px
操作栏图标
上下文图标
系统通知图标 (白色)
32×32 px
16×16 px
24×24 px
48×48 px
24×24 px
36×36 px
32×32 dp 96×96 px
16×16 dp 48×48 px