Skip to main content
appkiro.com
Chrome 扩展 • 响应式调试利器

在真实视口中测试任何网站 覆盖 96 款手机、平板与桌面设备

将任意 Chrome 标签页变身为功能完备的移动端调试工作台。在高度逼真的真机外壳中查看线上或本地网页，验证手势交互与虚拟键盘推顶效果，并列多端同步联动，随时执行无障碍体验体检。

了解使用流程Try the Screenshot Extension

即将上线 Chrome 应用商店 — 生产级源码已就绪

  • 96 款真实硬件设备预设
  • 带壳截图、屏幕录制与批量捕捉
  • 纯本地浏览器运行，无需注册账号
AppKiro 移动端模拟器：在 iPhone 真机模型中预览网站，旁边展示包含 96 款设备预设的下拉菜单
Swipe the image to see the full frame. Pick from 96 profiles, or open up to six viewports side by side in the same tab. Artwork from the extension's store listing.

96 ready-made device profiles

从紧凑型智能手表、主流智能手机，到最新折叠屏旗舰、平板电脑与 4K 超宽桌面显示器。每款预设均精准配置了标准 CSS 视口尺寸与实际设备像素比 (DPR)。

  • 31

    iPhone 系列

    从经典的 iPhone 5 到 iPhone 17 Pro Max，涵盖 SE、X、XR 及 iPhone Air。

  • 32

    Android 手机矩阵

    三星 Galaxy S10 至 S26 Ultra、Pixel 5 至 10 Pro，以及小米、OPPO、一加、华为、Infinix 与 Zebra 手持工控机。

  • 7

    折叠屏设备 (Foldables)

    Galaxy Z Fold 2、Z Fold6、Z Flip3、Z Flip6、Pixel 9 Pro Fold、Pixel 10 Fold 与 Moto Razr 70 Ultra。

  • 11

    平板电脑 (Tablets)

    iPad、iPad mini、iPad Air、iPad Pro 11" 与 13" M4、Galaxy Tab S7 与 S9 Ultra、Surface Pro 11 及 Surface Duo。

  • 11

    笔记本与桌面显示器

    MacBook Air、MacBook Pro 14" 与 16"、iMac 24"、Dell 笔记本，以及 1080p、2K QHD 与 4K UHD 电脑分辨率。

  • 3

    特种显示屏幕

    三星智能电视 (Smart TV)、自助点餐机终端 Kiosk 与 Sonoff 智能家居墙面中控屏。

  • 1

    智能手表 (Smartwatch)

    Apple Watch Series 6 (40 mm)，帮助检验极端微型视口下的界面回退展现。

每个设备档案均包含完备技术参数：

  • CSS 视口尺寸 (Viewport Width / Height)
  • 设备像素比 (Device Pixel Ratio - DPR)
  • 原生 User-Agent 字符串
  • 操作系统名称与版本标识
  • 刘海屏与灵动岛物理轮廓
  • 安全显示边距 (Safe-area insets)
  • 模拟网络连接环境类型
  • 精细拟真机身外壳材质

Custom Device Viewports

Add a custom device with its own name, viewport, pixel ratio, OS, network type and user-agent string. Star favorite devices to access them immediately.

模拟真实移动端环境，绝不仅是拉伸窗口宽度

移动端测试需要考虑真实交互细节。模拟器不仅重现视口单位，更深度模拟了触控惯性、弹起键盘与屏幕边距。

  • 页面准确识别当前移动设备

    为顶级页面及子 iframe 深度伪装 User-Agent 与 Client Hints，让依赖设备判断的前端业务脚本准确进入移动分支。

  • 真实触控手势与滑动物理惯性

    触发纯正 Touch 事件，滑动具有平滑减速惯性，鼠标指针变为圆形指尖光标 — 快速排查仅依靠悬停 (Hover) 的死胡同设计。

  • 虚拟键盘弹起挤压页面可视区

    点击输入框自动升起拟真软键盘并挤压有效视口高度，轻松发现吸底按钮被遮挡或表单被盖住的严重体验缺陷。

  • 准确计算移动端动态视口单位

    让 vh、svh、dvh 和 lvh 精准按照模拟视口解析，并在安全区变量 env(safe-area-inset-*) 中反馈真实的刘海屏与横条数据。

  • 高拟真机身外壳与真实系统栏

    外壳呈现原生状态栏与系统地址栏，直观评估全屏首屏（Hero Banner）在真实手机里的真实可见区域。

  • 固定时钟与电量，规范文档截图

    可将状态栏时间锁定为 9:41、电量固定为 100%，让全套产品文档、汇报 PPT 或宣传图呈现专业统一的视觉面貌。

  • 横竖屏单键翻转与等比缩放

    一键在竖屏 (Portrait) 与横屏 (Landscape) 间切换，按屏幕分辨率无级缩放画幅，且完全保留页面当前输入状态。

  • PWA 渐进式应用智能识别

    自动探测站点的 Web App Manifest 清单文件，直接预览该网站作为独立应用安装至手机桌面的呈现形态。

多端并排同屏呈现，动作完全实时同步 在一块显示器上同时对比手机、平板和桌面布局。在一个视口内做出的滚动、点击与输入，其余视口实时响应。

四种专业截屏模式，满足演示、工单与文档需求

直接从设备视口中截取高质量画面，支持精致机壳、标注画笔与多格式导出。

  • 带机身外壳截图 (With Device Frame)

    将页面完整呈现在逼真手机外壳中，包含状态栏与弧形边角 — 极为适合客户评审汇报、作品集展示与应用宣传册。

  • 仅网页内容截图 (Site Only)

    仅截取模拟视口内的纯网页内容，剔除多余外壳 — 便于研发与测试人员纯粹针对界面缺陷提交清晰工单。

  • 截取整页滚动长图 (Full Page)

    自动顺次滚屏并无缝拼接当前设备宽度下的整个网页，输出整张高分辨率长图，避免手工拼图割裂。

  • 截取完整浏览器标签页

    完整记录当前 Chrome 标签页视窗，包含模拟器侧边操作控制面板，便于输出完整的测试操作规程文档。

The AppKiro Mobile Simulator capture dialog offering capture with the device, the site only, the entire page and the entire tab, with a batch capture entry underneath
Swipe the image to see the full frame. The capture dialog, with batch capture one row below the single-device modes.

Annotation tools in the editor

Mark up responsive issues right where they are captured before copying or saving.

  • Pen
  • Arrow
  • Line
  • Rectangle
  • Ellipse
  • Stroke colour
  • Stroke width
  • Undo

Export and handoff

Save as PNG or WebP, copy to clipboard, or upload to generate a quick shareable preview link.

A full-page capture of a site simulated on an iPhone, with the export panel showing the stitched image dimensions and buttons to download as WebP or PNG, copy the image, or upload and share it
Swipe the image to see the full frame. Full-page mode scrolls past the fold and stitches the result into one image at the device's width.

录制高质量交互视频，集成麦克风与摄像头

无需安装 OBS 等复杂录像软件，即可录制高清 Bug 复现过程、交互流程走查或产品功能发布小短片。

  • 灵活选择录制手机画面或整个标签页

    自由决定仅录制手机屏幕核心交互范围，还是包含模拟器工具条的完整浏览器视窗。

  • 麦克风真人解说与圆形摄像头画中画

    同步录制麦克风旁白，并可在视频右下角开启个人圆形摄像头，让产品演示与设计评审充满温度。

  • 直接导出高码率 WebM 文件

    录制完成后即可直接将视频存入本地，体积小巧且画质清晰，方便迅速丢进 Jira 缺陷单或 Slack 频道。

  • 纯本地安全录制，零数据外流

    依托浏览器原生 MediaRecorder API 本地编码视频，全程不上传任何视频音频流至任何远端服务器。

一键批量截取数十台设备视口，自动化验收

告别一台台切换机型的低效循环。只需单次点击，自动对整个设备矩阵依次截图归档，生成交付材料。

The AppKiro Mobile Simulator batch capture dialog with a searchable device list, several iPhones selected, capture-mode and orientation options, and a start capture button showing eleven devices queued
Swipe the image to see the full frame. Pick the devices once, choose a capture mode and orientation, and the run does the rest.

  • 丰富的主题预设方案

    一键选择常见手机组、热门 iPhone 系列、Android 矩阵、平板全家桶或标准前端响应式断点组。

  • 实时进度把控与失败重试

    直观展示逐台设备的捕获进度条，若因网络延迟导致单台加载超时，可一键针对失败项单独重试。

  • 打包 ZIP 归档或合并为单张对比图

    将全部截图统一打包为 ZIP 压缩包下载，亦可自动拼接生成一张包含所有机型横向排列的总对比图（Contact Sheet）。

  • 按需自由勾选设备列表

    从 96 款设备目录中灵活勾选项目所需的特定型号组合，完全贴合你们产品的实际用户设备大盘数据。

Presets for batch testing

  • Common Phones
  • iPhone Matrix
  • Android Matrix
  • Responsive QA
  • App Store sizes
  • Play Store sizes

即时扫描 WCAG 可访问性与拇指工效学盲区

在代码交付生产前，直接在手机视口中快速定位色彩对比度隐患与单手触控操作盲区。

  • 色彩对比度实时检测

    严格对照 WCAG AA 与 AAA 标准测算前景色与背景色对比度，自动标出在强光下难以辨识的弱对比文本元素。

  • 触控热区尺寸合规审查 (Tap Targets)

    检测按钮与超链接是否达到建议的 48x48px（或 44x44px）最小触控范围，防止用户单手点按时发生误触。

  • 标题层级结构检查 (H1–H6)

    结构化梳理网页中的标题标签层级，揪出跨级跳号现象，保障屏幕朗读器用户的顺序理解无障碍。

  • 图片 Alt 替代文本巡检

    快速标记缺少 alt 属性或描述不清晰的图片，让视障辅助工具能准确传达信息，同时促进 SEO 优化。

  • 键盘焦点顺序追踪 (Focus Order)

    直观绘制 Tab 键焦点的跳转路径，确保外接键盘或辅助输入设备的用户能够按照自然阅读流顺畅操作。

  • 单手操作拇指工效学热区

    叠加热区图层划分单手握持时的“舒适触摸区”、“微费力延伸区”与“极难触及区”，评估关键核心操作按钮是否顺手。

Actionable inspection. Clicking a finding highlights the element without changing the page state.

为专业开发者的日常节奏量身定制

支持深度自定义机型视口参数、外观主题与全局键盘快捷键。

The AppKiro Mobile Simulator settings panel on its device tab, offering full chrome, status bar and clean view display modes alongside switches for the device frame, the device name label, keyboard simulation and native scrollbars
Swipe the image to see the full frame. Full chrome, status bar only, or a clean viewport — plus the device frame, name label, keyboard simulation and scrollbars.

  • 自定义添加专属设备

    按需录入独特的视口分辨率、像素比 DPR、操作系统名称与 User-Agent，测试特殊显示工控机或新型号。

  • 全局快捷键疾速唤起

    在 Chrome 快捷键配置中为模拟器绑定专属快捷键，实现秒开模拟器、旋转机身与快速抓图。

  • 机身状态栏细节微调

    随时显示或隐藏原生状态栏、Wi-Fi 指示图标与底部主页横条，按需定制纯净图面。

  • 深度暗色模式 (Dark Mode)

    全功能界面深度适配暗黑配色，与现代开发者常用的 IDE 及开发工具环境无缝融合，久看舒适不刺眼。

简单四步完成高标准移动端响应式测试

消除从开发完成到全设备视觉验收之间的所有冗余工序。

  1. 1

    在 Chrome 中打开目标页面

    访问任何本地开发地址或公网链接（完美支持 localhost 本机调试、测试服内网环境与 file:// 静态文件）。

  2. 2

    唤醒模拟器并挑选目标设备

    点击右上角 AppKiro 图标，页面立即被精准嵌入到带有真实几何边框的拟真机壳视口中。

  3. 3

    进行手势交互、表单输入与多端对比

    滑动测试自然滚动，触发输入框唤起虚拟键盘排查遮挡，或同时并列多款机型同步走查流程。

  4. 4

    截取图片、录制视频或审查无障碍

    生成精致带壳宣传图、录制带语音的操作视频、执行对比度安全排查，或批量生成全设备验收报表。

相比 Chrome F12 自带的 Device Mode，优势在哪里 Chrome 开发者工具是优秀的代码调试器，但 AppKiro 移动端模拟器提供了对外汇报、视觉走查与全量测试不可或缺的拟真环境。

谁在日常工作中使用 AppKiro 移动端模拟器

专为所有对移动端网页体验与交互品质负有责任的数字创作者打造。

  • 前端工程师

    在本地开发环境中校验 CSS Media Queries 断点、调试安全区 Notch 适配、排查移动端触控事件与 svh/dvh 动态高度。

  • 测试与 QA 工程师

    大幅压缩多机型回归测试周期，快速执行无障碍合规性审查，生成带有精美机身外壳与准确环境标识的 Bug 工单配图。

  • UI / UX 设计师

    复核线上网页对 Figma 视觉还原的像素精确度，评估大屏手机下的单手操作拇指可达性，导出用于方案汇报的高清模型图。

  • 市场营销与自媒体运营

    截取新上线活动落地页在各主流旗舰机型上的高清视觉图，录制生动的带真人解说的手机演示视频用于社交网络分发。

  • 产品经理 (PM)

    在评审会与敏捷演示中直接在真实手机视口下向团队展现新功能，无需在会议室里四处向同事借用不同品牌的实体测试机。

相比 Chrome F12 自带的 Device Mode，优势在哪里

Chrome 开发者工具是优秀的代码调试器，但 AppKiro 移动端模拟器提供了对外汇报、视觉走查与全量测试不可或缺的拟真环境。

  • 真机模型外壳带来真实临场感

    DevTools 呈现的仅是白框里的扁平色块。AppKiro 用高精度的手机机身外壳与真实系统栏包装页面，真实还原用户手持体验。

  • 精准重现虚拟键盘引起的布局位移

    真机中软键盘升起会极大压缩视口有效可用空间。DevTools 不模拟此形变；AppKiro 真实推挤界面，立即暴露吸底按钮失效等痛点。

  • 支持多设备并排同屏同步联动

    DevTools 强制你一次只能看一种尺寸。AppKiro 允许手机、平板、电脑同屏展开，滚一次页面即刻测完三个断点。

  • 无需云真机租用，纯本地无延迟离线运行

    省去昂贵的云真机平台订阅费，完全避免远程投屏带来的网络操作卡顿延迟，轻松调试内网私有 localhost，杜绝代码泄露。

这款扩展不能替代什么

安装前务必了解：基于浏览器视口模拟器的真实能力边界。

  • 是视口模拟器，不是真机云测实验室

    网页由您本地的 Chrome 内核渲染。iOS Safari 或 WebKit 的专属渲染缺陷不会在此重现，依赖特定手机 GPU 或硬件传感器的场景也无法模拟。

  • 不是原生移动应用模拟器

    它仅模拟移动端的网页浏览环境。它无法运行 iOS 或 Android 原生应用安装包，不能取代 Xcode 模拟器或 Android Studio 虚拟机。

  • 部分特殊网页无法模拟

    明确拒绝 iframe 嵌入的安全网页，以及 chrome:// 开头的内部设置页和 Chrome 应用商店本身，受浏览器安全限制无法在此展示。

关于移动端模拟器的常见解答

针对机型数量、模拟精度与日常使用流程的坦诚回应。

AppKiro 移动端模拟器是一款怎样的工具？

这是一款强大的 Chrome 扩展程序，能将浏览器标签页即刻转为手机、平板、折叠屏或电脑模拟环境。它按照所选机型的精确视口尺寸、DPR 像素比、User-Agent 和安全边距渲染真实网页，并在此基础上提供了带壳截图、屏幕录像、多机型批量捕获及无障碍合规检测面板。

如何在不同的屏幕尺寸下测试网站效果？

打开目标网页，唤醒模拟器，在下拉列表中挑选 96 款预设机型中的任意一款即可。你还可以并排开启多个设备视口，打开同步联动开关，此时在其中一个屏幕上的滚动、点击和文字输入都会实时镜像至所有其他设备上。

这与 Chrome 开发者工具 (F12) 的 Device Mode 有何不同？

DevTools 仅简单拉伸视口宽高并切换 User-Agent。AppKiro 增加了带有原生状态栏的写实机身模型、软键盘弹起引起的真实页面推挤模拟、正确的 svh/dvh/lvh 与安全边距计算、多设备并排同步联动、带壳与全页长截图、屏幕录制、设备矩阵批量截图以及 WCAG 无障碍审查面板。

我还需要采购实体测试机或租用云测平台吗？

基本无需。所有模拟完全运行在你自己的电脑 Chrome 中。它精准解决了绝大多数关于响应式排版、断点展现、触摸交互与页面视口尺度的验证需求，无需背负昂贵的硬件采购与维护成本。

模拟器具体包含哪些设备机型？

内置了 96 款真实硬件配置：31 款 iPhone、32 款主流 Android 手机、7 款折叠屏、11 款平板电脑、11 款笔记本与桌面显示屏、3 款特种大屏（智能电视、收银终端机、Sonoff 墙面屏）以及 1 款 Apple Watch 手表。你也可以随时按需录入自定义设备。

可以为模拟中的设备截取图片吗？

可以，支持 4 种截屏模式：带精致机身外壳、仅截取网页视口、自动滚屏拼接全页长图、或截取整个标签页。截图后直接进入内置编辑器，支持箭头、线框等标注，可导出 PNG/WebP、存入剪贴板或生成在线链接。

能一次性对很多台设备同时批量截图吗？

完全可以。批量捕获 (Batch Capture) 功能支持任选一组机型，在单次运行中自动对指定网址在所有设备上依次完成渲染并截图，支持实时监控进度、单独重试失败项，并可一键打包 ZIP 下载或合并输出单张总对比图。

它会收集我的浏览数据或上传隐私吗？

绝对不会。扩展不要求注册登录，无任何埋点跟踪或第三方分析探针。所有的模拟运算、页面渲染与图片录像处理 100% 在你本地电脑内闭环完成。只有当你主动点击生成分享链接时，单张截图才会上传至服务器。

可以测试 localhost 本地服务或本地 HTML 文件吗？

完全支持。本地开发服务器（如 localhost 或 127.0.0.1）与普通公网链接使用方式完全一致。若要测试本地 file:// 静态文件，只需在 Chrome 扩展管理页面 (chrome://extensions) 中为本插件勾选“允许访问文件网址”即可。

这款扩展需要付费吗？有何系统要求？

完全免费，所有功能均已解锁，无任何付费门槛与订阅套路。仅需使用支持 Manifest V3 的 Google Chrome 116 或更高版本浏览器即可流畅运行。界面现已全面支持 52 种语言。

AppKiro 平台更多开发者工具

无需安装，在浏览器中即可直接使用的实用图像与设计辅助利器。

高效、专业地完成全套移动端响应式视觉测试

立即在 Chrome 中安装 AppKiro 移动端模拟器，轻松在 96 款真实硬件视口中验证布局、模拟真实手势并输出带框模型图。

浏览全部在线工具Try the Screenshot Extension

即将上线 Chrome 应用商店 — 生产级源码已就绪