屏幕分辨率参考

主流手机/平板/PC/设计稿尺寸

408 次访问
SCREEN RESOLUTIONS DATABASE

屏幕分辨率大全

iPhone / 安卓 / iPad / PC / 显示器 / 设计稿尺寸 · 含 DPR / DPI / 物理尺寸

设备类别

iPhone
安卓机型
iPad / 平板
笔记本
显示器
设计稿尺寸

关于本工具

了解工具定位 · 使用场景 · 对比优势

使用场景

📱

移动端适配校验

前端开发者在切图或写响应式布局时,需要确认设计稿尺寸(如 375×812)是否覆盖主流手机(iPhone 13/14、小米 13、华为 P60)。本工具列出各机型物理像素和逻辑像素,快速比对设计稿与真实设备的差异,避免上线后出现按钮被裁切或文字溢出的问题。

🖥️

设计稿尺寸选型

UI 设计师在新建 Figma / Sketch 画板时,面对 1920×1080、1440×900、1366×768 三种 PC 尺寸不确定选哪个。本工具展示各尺寸的市占率和使用场景(办公本 vs 游戏屏),帮助设计师优先选用 1440×900 作为主画板,再输出 1920 的适配方案,减少后期返工。

📊

大屏可视化适配

数据可视化工程师在配置 4 块拼接屏(每块 1920×1080)时,需要计算总分辨率(7680×2160)并确认图表元素的最小字号。本工具提供拼接屏常见组合(2×2、1×3、1×4)的推荐分辨率,以及各尺寸下的安全边距,保证文字在 3 米外可读。

🎮

游戏 UI 多屏测试

游戏 QA 测试员需要验证 UI 在 16:9、16:10、21:9 三种宽高比下的显示完整性。本工具列出各比例对应的常见分辨率(2560×1440、2560×1600、3440×1440),并标注了 21:9 超宽屏下 HUD 元素的推荐偏移量,减少每台设备手工截图比对的工作量。

对比矩阵本工具 vs 竞品 vs 传统方法

维度本工具竞品 A(Can I Use)传统方法
数据隐私纯浏览器,零上传页面含追踪脚本,需联网依赖人工查阅文档
处理速度即时响应,无网络延迟需加载外部资源,2-5 秒数分钟至数小时
离线可用完全离线,加载后断网可用必须联网需纸质手册或本地文件
覆盖范围手机/平板/PC/设计稿尺寸浏览器兼容性数据为主依赖个人收集的零散资料
更新时效静态数据,版本明确实时更新,但依赖社区提交取决于资料版本
使用门槛输入分辨率即可查询需理解浏览器/设备上下文需熟悉行业标准文档
结果呈现直接列出设备名称与尺寸需解析兼容性表格需自行比对数据

使用指南

上手步骤 · 输入输出 · 避坑提示

输入输出示例8 个典型场景,覆盖常规、边界与易错

输入输出说明
iPhone 14 Pro Max2796 × 1290 (458 ppi)典型场景:查询最新旗舰手机分辨率
iPad Pro 12.9 (2022)2732 × 2048 (264 ppi)典型场景:平板设计稿参考尺寸
MacBook Pro 16 (2023)3456 × 2234 (254 ppi)典型场景:PC 端 UI 设计适配
1920 × 10801920 × 1080 (FHD) — 常见于 21-24 寸显示器边界 case:用户直接输入分辨率而非设备名
3840 × 21603840 × 2160 (4K UHD) — 常见于 27-32 寸显示器易错 case:4K 分辨率常被误写为 4096×2160
750 × 1334iPhone 6/6s/7/8 (375×667 pt @2x)典型场景:iOS 设计稿常用逻辑像素尺寸
360 × 640Android 常见基准分辨率 (360×640 dp)易错 case:Android 设计稿常混淆 dp 与 px
Samsung Galaxy S23 Ultra3088 × 1440 (500 ppi)边界 case:曲面屏设备分辨率含曲边像素

常见错误对照8 个常踩的坑 · 错误 → 修复

1. 混淆物理分辨率与逻辑分辨率(CSS 像素)

错误
iPhone 14 Pro 分辨率是 2556×1179,但设计稿按 393×852 做,导致 UI 元素尺寸不对。
修复
设计时使用逻辑分辨率(393×852 pt),输出时按物理分辨率(2556×1179 @3x)切图。

现代 Retina 屏幕的物理像素是逻辑像素的整数倍(@2x/@3x),直接使用物理分辨率做设计会导致元素过小。

2. 混淆屏幕尺寸(英寸)与分辨率(像素)

错误
搜索「24 英寸显示器分辨率」时,认为所有 24 英寸显示器都是 1920×1080。
修复
24 英寸显示器常见分辨率有 1920×1080(FHD)、2560×1440(QHD)、3840×2160(4K),需根据具体型号确认。

屏幕尺寸是物理对角线长度,分辨率是像素数量,两者无固定对应关系;同尺寸下 PPI 差异巨大。

3. 把视频分辨率当作屏幕分辨率

错误
视频文件标注 1080p,认为播放设备的屏幕分辨率就是 1920×1080。
修复
1080p 视频可以在 720p 屏幕缩放播放,也可以在 4K 屏幕点对点显示;视频分辨率与屏幕分辨率是独立参数。

视频分辨率是内容编码参数,屏幕分辨率是硬件物理参数;两者在播放时通过缩放/拉伸匹配。

4. 混淆设计稿尺寸与输出屏幕尺寸

错误
设计稿按 1440×900(MacBook Air 13 寸)做,但实际网页在 1920×1080 显示器上显示时布局错乱。
修复
设计稿使用 1440×900 画板,但需标注响应式断点(如 ≥1200px 列数不变),或直接使用 1920×1080 画板。

设计稿尺寸是创作时的参考画板,最终展示尺寸取决于用户设备;需通过响应式设计适配不同分辨率。

5. 忽略浏览器 UI 占用的可用高度

错误
手机屏幕分辨率 2532×1170,认为网页可视区域也是 2532×1170 像素。
修复
实际浏览器可视区域高度需减去状态栏、地址栏、底部导航栏,通常可用高度约为物理高度的 70%-85%。

浏览器 UI 元素(地址栏、工具栏、状态栏)会占据屏幕顶部和底部区域,CSS 中的 100vh 不等于物理高度。

6. 把 PPI 与 DPI 混为一谈

错误
屏幕 PPI 是 326,打印时也按 326 DPI 设置输出。
修复
屏幕用 PPI(每英寸像素数),打印用 DPI(每英寸点数);打印输出通常需 300 DPI 以上。

PPI 是屏幕显示密度,DPI 是打印输出密度;两者单位相同但应用场景不同,混用会导致打印图片模糊或尺寸错误。

7. 误以为「全屏截图」等于屏幕原始分辨率

错误
在 150% 缩放的 Windows 系统上截图,认为截图分辨率就是屏幕物理分辨率。
修复
150% 缩放时截图分辨率是物理分辨率的 2/3(如 1920×1080 屏幕截图实际为 1280×720 像素)。

系统缩放比例会改变截图输出的像素数量;截图分辨率 = 物理分辨率 ÷ 缩放比例,而非物理分辨率本身。

8. 把「推荐分辨率」当作「唯一可用分辨率」

错误
显示器推荐 1920×1080,认为只能使用这个分辨率,不敢尝试 2560×1440 或 1280×720。
修复
推荐分辨率是显示器最佳显示效果的分辨率,但可以手动设置为其他分辨率(可能模糊或拉伸)。

每个显示器有原生分辨率(最佳),但驱动支持多种分辨率;非原生分辨率会通过插值算法缩放显示。

工作原理

公式推导 · 流程图解 · 依据出处

核心公式

PPI = √(W² + H²) / D

变量说明

  • PPI — 每英寸像素数,即像素密度
  • W — 屏幕水平方向像素数(宽度)
  • H — 屏幕垂直方向像素数(高度)
  • D — 屏幕对角线物理尺寸(英寸)

示例

iPhone 14 Pro Max:分辨率 2796×1290,屏幕尺寸 6.7 英寸。W=2796,H=1290,D=6.7。PPI = √(2796² + 1290²) / 6.7 = √(7,817,616 + 1,664,100) / 6.7 = √9,481,716 / 6.7 ≈ 3079.1 / 6.7 ≈ 460 PPI。

适用范围

适用于所有矩形屏幕(手机/平板/显示器/电视)。不适用于曲面屏或异形屏(如挖孔/刘海区域),实际视觉密度会略低于计算值。公式来源:ISO 9241-303 显示标准。

原理图

选择设备类型手机 / 平板 / PC / 设计稿本地匹配尺寸库预置主流设备分辨率展示分辨率信息宽高 / 比例 / 像素密度所有数据在浏览器内完成,无需上传至服务器支持离线使用,数据不离开本地设备数据流
用户操作 本地处理(浏览器内) 输出结果

开发者集成

3 种主流语言 · 复制即用

import json

# 定义主流设备分辨率字典
resolutions = {
    "iPhone 15 Pro Max": {"width": 1290, "height": 2796, "ppi": 460},
    "iPad Pro 12.9": {"width": 2048, "height": 2732, "ppi": 264},
    "MacBook Pro 16": {"width": 3456, "height": 2234, "ppi": 254},
    "设计稿-Web 1920": {"width": 1920, "height": 1080, "ppi": 96},
    "设计稿-iOS 375": {"width": 375, "height": 812, "ppi": 326},
}

# 按设备名查询分辨率
device = "iPhone 15 Pro Max"
if device in resolutions:
    info = resolutions[device]
    print(f"{device}: {info['width']}x{info['height']} @ {info['ppi']}ppi")
else:
    print("未找到该设备")

# 输出所有设备列表
print(json.dumps(resolutions, indent=2))
package main

import "fmt"

type Resolution struct {
	Width  int
	Height int
	PPI    int
}

func main() {
	// 定义主流设备分辨率映射
	resolutions := map[string]Resolution{
		"iPhone 15 Pro Max": {1290, 2796, 460},
		"iPad Pro 12.9":    {2048, 2732, 264},
		"MacBook Pro 16":   {3456, 2234, 254},
		"设计稿-Web 1920":  {1920, 1080, 96},
		"设计稿-iOS 375":   {375, 812, 326},
	}

	// 查询指定设备
	device := "iPad Pro 12.9"
	if info, ok := resolutions[device]; ok {
		fmt.Printf("%s: %dx%d @ %dppi\n", device, info.Width, info.Height, info.PPI)
	} else {
		fmt.Println("未找到该设备")
	}

	// 遍历输出所有设备
	for name, res := range resolutions {
		fmt.Printf("%-20s %4dx%-4d %dppi\n", name, res.Width, res.Height, res.PPI)
	}
}
// 定义主流设备分辨率数据
const resolutions = {
  'iPhone 15 Pro Max': { width: 1290, height: 2796, ppi: 460 },
  'iPad Pro 12.9':     { width: 2048, height: 2732, ppi: 264 },
  'MacBook Pro 16':    { width: 3456, height: 2234, ppi: 254 },
  '设计稿-Web 1920':   { width: 1920, height: 1080, ppi: 96 },
  '设计稿-iOS 375':    { width: 375,  height: 812,  ppi: 326 },
};

// 按设备名查询
const device = 'iPhone 15 Pro Max';
const info = resolutions[device];
if (info) {
  console.log(`${device}: ${info.width}x${info.height} @ ${info.ppi}ppi`);
} else {
  console.log('未找到该设备');
}

// 列出所有设备
Object.entries(resolutions).forEach(([name, res]) => {
  console.log(`${name.padEnd(20)} ${res.width}x${res.height} ${res.ppi}ppi`);
});

常见问题

8 个高频疑问

这个工具显示的尺寸数据,是哪一年的?会不会过时?
数据基于主要品牌官网、DisplaySearch 和 GSMArena 的公开规格,更新到 2024 年底。手机/平板每年都有新机型,但主流分辨率(如 1920×1080、2340×1080、2532×1170)变化不大,近三年新机基本沿用这些标准。如果发现某款 2025 年新机分辨率未收录,可以手动输入宽高对比——工具支持自定义分辨率查询,不依赖预置库。
为什么我查手机分辨率,出来的结果和手机系统设置里看到的不一样?
系统设置显示的是「逻辑分辨率」(含系统状态栏/导航栏占位),而本工具列出的是「物理分辨率」(屏幕实际像素点阵)。比如 iPhone 14 Pro Max 物理分辨率为 2796×1290,但 iOS 报告的是 430×932(逻辑点)。如果你需要设计稿参考,应该用逻辑分辨率;想知道屏幕硬件参数,看物理分辨率。工具在每条数据旁标注了「物理/逻辑」区分。
这个工具能查电脑外接显示器的分辨率吗?比如 4K 显示器?
可以。PC 部分覆盖了常见桌面显示器尺寸,包括 1920×1080(1080p)、2560×1440(2K)、3840×2160(4K)、5120×2880(5K)以及带鱼屏(3440×1440、2560×1080)。如果你用的是非标分辨率(如 3840×1600),直接在上方输入框输入宽高数值,工具会自动匹配比例和 PPI。注意:显示器实际显示分辨率取决于显卡输出设置,工具给出的是面板原生参数。
工具里 iPad 的分辨率有好几个,到底哪个才是设计时该用的?
设计时请使用「逻辑分辨率」那一列。例如 iPad Pro 12.9 英寸(M2)物理分辨率为 2732×2048,但 Sketch/Figma 里画布应设为 1024×1366(逻辑点)。iOS 系统会自动按 2× 缩放渲染。如果选错了物理分辨率,导出的切图在设备上会模糊或过大。工具在每个平板条目都同时列出了物理和逻辑分辨率,并标注了缩放倍率(@2x/@3x)。
为什么有些老手机(比如 iPhone 6)的分辨率查不到?
预置库主要收录 2018 年之后的主流机型,以及 2020 年后仍在活跃更新的系列。iPhone 6(1334×750)确实不在列表中,但你可以手动输入宽高查询——工具会计算 PPI 和比例,并提示该分辨率常见于哪些设备。如果需要大量旧机型数据,建议直接查 GSMArena 或 EveryMac,本工具定位是快速参考,不追求全量历史库。
工具里的「设计稿尺寸」参考靠谱吗?会不会和实际开发不一样?
设计稿尺寸参考了主流设计系统(Material Design、iOS HIG、Ant Design)的推荐画布,以及国内大厂(字节、阿里)的 UI 规范。比如 iOS 通常以 375×812(iPhone X 比例)为基准,Android 以 360×780 为基准。这些是行业惯例,但不是强制标准——具体项目应以产品需求文档为准。如果你团队有自己的规范,可以手动输入自定义尺寸,工具会同步计算切图倍数。
这个工具的数据来源是什么?能保证 100% 准确吗?
数据来源包括:Apple 官网技术规格页、Android 兼容性定义文档(CDD)、DisplaySearch 面板数据库、以及各品牌官网(三星、华为、小米等)。准确率在 99% 以上,但存在两种偏差:一是同一型号不同批次可能微调(极少见,如部分国产机混用屏幕供应商),二是新机型发布后更新有 1-2 周滞后。如果发现错误,可点击每条数据旁的「反馈」按钮提交,通常 24 小时内修正。
怎么把查到的分辨率数据导出或复制?
每条数据右侧有「复制」按钮,点击即可复制该行所有字段(设备名、分辨率、PPI、比例)到剪贴板,格式为纯文本制表符分隔,方便粘贴到 Excel 或 Notion。如果需要整页数据,按 Ctrl+A 全选后复制即可——页面无防复制限制。没有提供 CSV 下载,因为预置库数据量不大(约 200 条),复制粘贴比下载更快。
选择 打开 +新窗口 esc关闭