Screen Resolution Checker: What Is My Screen Resolution?
Screen Resolution Checker. See your display instantly with this screen resolution checker: your width, height, pixel ratio and color depth appear as soon as the page loads. The aspect ratio calculator converts pixel dimensions to a simplified ratio and calculates missing width or height from a known ratio.
Interactive Tool
Your Screen Resolution
Width × height in pixels — updates live if you resize this window.
Display Information
Enter your screen size to see its pixel density (PPI) from the physical resolution.
Browser Viewport
Device Information
This tool only reads information your browser already shares with any site you visit — screen and viewport dimensions, color depth, pixel ratio, device type, and display capabilities like HDR and color gamut support. Nothing is uploaded, stored, or sent anywhere.
This screen resolution checker reads your display the moment you open the page — you'll see your screen width and height in pixels, pixel ratio, color depth, aspect ratio, and browser viewport size all laid out with zero clicks required.
Ever wondered why a screenshot saves bigger than your screen seems to be? This screen resolution checker tool answers that as the page loads, reading your browser to show the true pixel count, scale factor and refresh rate of your screen. It's a free online tool that updates in real-time on all your devices, so you can check screen resolution online without opening a settings menu.
How the Screen Resolution Checker Reads Your Display
Resolution detection happens inside the page: it asks the operating system what size it reports, multiplies that by the scale factor and fills every field. Nothing is stored. As a plain screen resolution tool, it works on a laptop, a phone, a smart TV or a projector feed.
Web designers and frontend development teams use the screen resolution checker to see which breakpoint a mobile responsive layout hits. For gaming, it confirms system requirements before you install; developers and designers use it to see why a mockup looks soft on another desktop.
Physical Resolution vs CSS Pixels
Your physical resolution is the grid of dots built into the panel, fixed by the hardware. The reported resolution, or logical resolution, is what the operating system hands to apps after enlargement, measured in CSS pixels. That's why screenshots save at physical pixels while web pages lay out in the smaller logical grid.
Device Pixel Ratio and Scaling Ratio
The device pixel ratio (DPR) links the two numbers:
$$DPR = \frac{\mathrm{physical\ width}}{\mathrm{reported\ width}}$$
HiDPI and Retina screens run at 2 or higher, so each CSS pixel is drawn by four or more dots and lettering looks sharper. Windows also offers fractional scaling such as 125% and 150%, giving a non-whole DPR; integer scaling like 200% scaling divides cleanly.
Detecting Resolution with JavaScript
The page reads screen.width and screen.height for the width and height in logical units, multiplies them by devicePixelRatio, and times frames with requestAnimationFrame to estimate redraw speed.
What Is My Screen Resolution? Reading Each Result
Take a 16-inch laptop whose panel is 3200 × 2000, set to 200% in its display settings. The screen resolution tester shows:
- Reported resolution: 1600 × 1000, what websites see
- Panel: 3200 × 2000, twice the reported width
- Total pixels: 6,400,000 (6.4 million)
- Shape: 16:10, landscape
- Density: about 236 PPI
The pixel count sets sharpness; 1600 × 1000 is what a web page or game HUD lays out against.
Aspect Ratio and Orientation
The aspect ratio is width over height in whole numbers, so 3200 × 2000 reduces to 16:10. Most 4K TVs are 16:9, ultrawide panels reach 21:9, and 4:3 survives on older projectors. Orientation flips when you rotate a handset.
Refresh Rate and Color Depth
Refresh rate is redraws per second: 60Hz suits office work, 120Hz and 144Hz smooth scrolling, and 240Hz targets esports. Color depth is bits per dot: 24-bit gives 8 bits to each of the RGB subpixels, while 30-bit (10-bit per channel) suits HDR and a wide color gamut.
Browser Viewport vs Total Pixels
The browser viewport is the part of the screen your browser window covers, minus toolbars, perhaps 1600 × 880 on the example. Resize or zoom and it shrinks; the resolution doesn't.
Resolution Detection in Practice: Fixing a Client's Broken Layout
A client emails a screenshot: on her new 14-inch laptop, the analytics dashboard I built shows the stacked mobile layout instead of two columns. My CSS switches to two columns at a min-width: 1680px media query, so the question is simple: what width is her browser actually reporting? The answer is 1646 px, which is 34 px short of my breakpoint.
I send her the screen resolution tool rather than asking her to dig through settings. She reads back three rows: physical 2880 × 1800, reported 1646 × 1029, pixel ratio 1.75. Her Windows install defaulted to 175% scaling. I cross-check by hand: 2880 ÷ 1.75 = 1645.7, which the browser rounds to 1646, and 1800 ÷ 1.75 = 1028.6, so the figures agree. The panel's density is √(2880² + 1800²) ÷ 14 ≈ 243 PPI, which is why the OS enlarges everything so far.
Then I rerun the same panel at each Windows scaling step:
| Scaling | Reported width | Layout at 1680px breakpoint |
|---|---|---|
| 125% | 2304 px | two columns |
| 150% | 1920 px | two columns |
| 175% | 1646 px | stacked |
| 200% | 1440 px | stacked |
Solving 2880 ÷ 1680 gives 1.714, so any scale above about 171% on this panel flips my layout. That's the number to watch: the bug isn't her machine, it's a breakpoint set by someone (me) testing on a 1920-wide monitor. The checker's reported-width row is the figure to compare against any breakpoint.
My next action is concrete: drop the two-column query to min-width: 1400px, below the 1440 px reported at 200%, which keeps her 175% and even 200% settings on two columns, and test at 1440 × 900 as a new standing case.
One caveat the reported width hides: media queries match the viewport, not the screen. If she un-maximizes the window, the checker's viewport row drops below 1646 px while the reported resolution stays put, so I ask her to read both rows before trusting either one.
Common Resolutions and Display Resolution Standards
Most popular screen resolutions follow named standards, so you can match the checker's numbers here:
| Name | Pixels | Typical use |
|---|---|---|
| SD (480p) | 640 × 480 | legacy video |
| HD (720p) | 1280×720 | entry-level TVs |
| Full HD / FHD (1080p) | 1920×1080 | office desktops |
| QHD / 2K (1440p) | 2560×1440 | gaming screens |
| UHD / 4K (2160p) | 3840×2160 | video editing |
| 5K | 5120 × 2880 | 27-inch high-density |
| 8K | 7680 × 4320 | flagship TVs |
A "1080p-class" phone is 1080 pixels wide but far taller than 1920 x 1080.
Pixel Density, PPI and Screen Size
Pixel density, in pixels per inch (PPI) or dots per inch (DPI), decides image clarity and sharp text, because one resolution spread over a bigger screen size gets coarser:
$$density = \frac{\sqrt{w^2 + h^2}}{\mathrm{diagonal}}$$
The example works out to √(3200² + 2000²) ÷ 16 ≈ 236 PPI; 1920 × 1080 on a 32-inch monitor is about 69. Past what your eyes resolve at your viewing distance, extra density only costs graphics performance and battery. Compare the checker's density figure with these rough buying tips:
- Below about 90 per inch, fonts look grainy (1080p on 27 inches is 82).
- 110 to 140 is the desk comfort zone (4K on 32 inches is 138).
- Above 200, the interface needs enlarging.
Resolution Tester Fixes: Native Resolution and Display Scaling
If the panel row doesn't match the spec sheet, the signal isn't arriving at native resolution. Panels need 1:1 pixel mapping; feed them anything else and they interpolate, making text blurry. Keep the hardware grid and resize with display scaling instead.
How Do I Change My Screen Resolution?
On Windows, open Settings › System › Display and pick the "Recommended" resolution. On macOS, open System Settings › Displays and choose a "looks like" size; on an older Mac, select Scaled. Reload this page to confirm.
Cables, GPU Drivers and External Monitors
If the checker reports 1920 × 1080 and 60Hz on an external monitor rated higher, suspect the link: 4K at 120Hz needs HDMI 2.1 or DP 1.4. Check the cable, update your GPU drivers, then recheck the result here.
Frequently Asked Questions
- Why doesn't my screen resolution match the monitor's spec sheet?
- Usually because of display scaling. The browser reports the logical (scaled) size, so a panel at 200% reports half its real width and height. Multiply the reported size by the device pixel ratio to get the physical resolution; if that still falls short of the spec, the signal isn't reaching the panel at its native resolution.
- Why is my device pixel ratio not a whole number?
- Windows and some Linux desktops offer fractional scaling such as 125%, 150% or 175%, which gives a pixel ratio of 1.25, 1.5 or 1.75. It works, but thin lines and some older apps can look slightly soft; whole-number scaling like 100% or 200% maps pixels cleanly.
- Is a higher screen resolution always better?
- No. What you see as sharpness depends on pixel density, which combines resolution with screen size and viewing distance. A high resolution on a small screen needs scaling to stay readable, while a low resolution on a large screen looks grainy. Past what your eyes can resolve, extra pixels mainly cost graphics performance and battery.
- What is the difference between screen resolution and browser viewport?
- Screen resolution covers the whole display. The browser viewport is only the area your browser window uses for the page, minus toolbars and tabs, so it changes when you resize or zoom. CSS media queries respond to the viewport, which is why web designers check both.
- Why does the refresh rate reading look wrong?
- Browsers estimate it by timing animation frames, so a background tab, battery-saver mode or heavy system load can read low. Keep the page in front and idle while it measures. If a high-refresh monitor still shows 60 Hz, check the refresh setting in your display settings and use a cable that supports the rate.
- Why do phones show such high resolutions?
- Phones pack their pixels into a small screen, so pixel density runs far higher than on a desktop monitor, and they use a pixel ratio of 2 to 4 so text stays a readable size. That's why a phone's reported width is small while its physical resolution is high.
- How do I change my screen resolution?
- On Windows, go to Settings, System, Display and choose the recommended resolution, then set the scale on the same page. On macOS, open System Settings, Displays and pick a 'looks like' size. Keep the panel at its native resolution and change size with scaling; a non-native resolution makes everything blurry.