Device sizes
The exact viewport, pixel ratio and resolution of every one of the 38 devices Viewport reproduces. Useful whether or not you ever install it.
Esta pagina aun no esta traducida y se muestra en ingles.
How to read this table
Viewport is the number that matters for CSS. It is the width and height in CSS pixels that the device reports to the page, and it is what your media queries are compared against. An iPhone 16 Pro is a 402 pixel wide device as far as your stylesheet is concerned.
DPR is the device pixel ratio: how many physical pixels the screen uses to draw one CSS pixel. It is why a 2x image looks sharp on a phone and why a 402 pixel wide layout is rendered across 1206 physical pixels.
Resolution is the two multiplied together. It is the number a manufacturer puts on a spec sheet, and it is the one number here that your CSS never sees.
Phones
Tablets
Laptops
Monitors
Where these numbers come from
This table is generated from the same device catalogue the extension renders its frames from, so the page and the product cannot disagree. Adding a device to Viewport adds a row here.
Every frame is drawn from geometry rather than from a photograph of a phone: bezel thickness, corner radii and cutout shape are numbers. That is why the frames stay sharp at any zoom, and why no manufacturer artwork is redistributed. Device names are used only to identify the viewport sizes; the marks belong to their owners.