🎉 Free poster now available! Get yours
customize map
Popularity
All Low Medium High
Size categories
XXL · min 1441 px XL · 1025 - 1440 px L · 801- 1024 px M · 601 - 800 px S · 415 - 600 px XS · max 414 px
Reset
View fullscreen
Screen size
Name
Category
Devices
Popularity

Screen size groups

The screen width is more relevant than screen height for UI and responsive design. So we clustered screens by width in six groups and applied different colors to enable a good screen size comparison. The groups provided here are not necessarily breakpoints in a CSS layout.

Extra-Extra-Large · min 1441 dp Extra-Large · 1025 - 1440 dp Large · 801- 1024 dp Medium · 601 - 800 dp Small · 415 - 600 dp Extra-Small · max 414 dp

Most common screen sizes

Popularity data used in the map paints a picture of worldwide screen usage. To make this feature possible, we had to gather browser and device statistics from different web resources and merge those to meet our needs and the device-independent pixel, a unit of measurement in digital displays.
We grouped popularity data in three categories.

High · more than 5% of worldwide popularity Medium · 2-5% of worldwide popularity Low · under 2% of worldwide popularity
Two devices, a laptop and a smartphone with different display resolutions.

What are device‐independent pixels?

Displays come in various resolutions, such as Retina, HD or 4K. This map uses a unit called device-independent-pixel (dp or dip).
Those units are not considering the resolution of a screen as inch or cm would do. Instead, DPs determine size values in a layout - no matter in which pixel density they will be rendered on a specific device. Developers and designers use DPs when creating digital products that have to work on devices with different resolutions.

EXAMPLE
Let's say a button in a layout has 300 dp width.
On a laptop with a low resolution screen it would render in 300 pixel. 1 dp is 1 px on the device (1:1 device pixel ratio). On an iPhone with a Retina display, the same button would have the same size of 300 dp, but would actually render in 600 pixel width, because 1 dp is 4 px on the HD display (1:2 device pixel ratio).

Good to know
Two devices, a laptop and a smartphone with different display resolutions. Two devices, a laptop and a smartphone with different display resolutions.

Receive the poster

You can receive the screen size map as a A2 poster via email. Print it out and put it on your wall. Use it as a handy reference when in doubt with viewport pixel sizes in your daily work.
And: yes, it also comes in black 😉