English
HrvatskiHow screen resolution works on the web
Your screen resolution is shown in the result, measured the way websites see it: the full width and height of your display in CSS pixels. It updates instantly if you move the window to another screen or change display scaling.
CSS pixels vs. physical pixels
Websites measure screens in CSS pixels, not the physical pixels of the display. On high-density screens, such as Retina displays, most phones and laptops with scaling turned on, one CSS pixel is drawn with several physical pixels. The device pixel ratio says how many.
To get your display’s physical resolution, multiply the displayed screen resolution by the pixel ratio. For example, 1440 × 900 at 2× is a 2880 × 1800 panel.
Common screen resolutions
- 1920 × 1080 (Full HD): the most common desktop and laptop resolution
- 2560 × 1440 (QHD): popular for larger monitors and gaming
- 3840 × 2160 (4K UHD): usually reported as 2560 × 1440 or 1920 × 1080, because 4K screens typically run at 150% or 200% scaling
- 360 to 430 wide: typical CSS widths of current smartphones
Screen resolution vs. browser window
Your screen resolution covers the whole display. Websites lay out pages according to the space inside your browser window, called the viewport, which is usually smaller because of toolbars, tabs and the taskbar.
When you need your screen resolution
- choosing the right wallpaper or image size
- checking display scaling after connecting a new monitor
- telling support how a page looks on your setup
- comparing what websites see with the specs of your display