What Is My Device Pixel Ratio Checker? Free Online Tool
What Is My Device Pixel Ratio Checker. Open this device pixel ratio checker to read your live Pixel Ratio and Display Class at once. The free color gamut checker runs entirely in your browser — nothing you enter is ever sent to a server.
Interactive Tool
Your Device Pixel Ratio
Hold a real credit card (85.6 mm wide) against the screen and enter how many CSS pixels wide it measures to estimate your screen’s physical size. This is a rough estimate.
Browser zoom and OS display scaling both move this number the same way — there’s no way to tell them apart from JavaScript alone.
The Device Pixel Ratio Checker reads your browser's live device pixel ratio and classifies it into a display class — 1x standard, 1.5x, 2x Retina/HiDPI, or 3x — so you know how many physical pixels back every CSS pixel on your screen. Enter an element width and the tool works out the matching 1x/2x/3x asset export size, the exact numbers a designer needs when shipping images for a HiDPI screen.
The what is my device pixel ratio checker reads your browser and shows how many physical pixels sit behind each CSS pixel on your screen. A result of 1 is a standard display, while 2 or more means a sharper, high-density panel. Here is how the number works, what changes it, and what common phones, tablets and laptops report for their screen resolution.
What Is My Device Pixel Ratio Checker Telling You?
What is device pixel ratio? DPR is the count of physical pixels your display uses to draw one CSS pixel. A standard monitor at 100% scaling reports 1. Retina displays and other high-dpi screens usually report 2 or 3. Windows scaling and OS display scaling can produce fractional values such as 1.25 or 1.5. Multiply the layout size by the ratio and you get the real panel size, which is why a sharp icon needs more image data on a dense screen than on a standard monitor. The tailwind breakpoint checker checks your input against current best practices and flags anything worth fixing.
CSS Pixels Versus Physical Pixels
A CSS pixel is the unit your browser uses for width, height and layout, so one CSS pixel is a logical measure and not a fixed dot. Physical pixels are the real points of light on the panel, sometimes called device pixels. With a ratio of 2, a 100-pixel-wide box in CSS is drawn with 200 device pixels across, and the same pixel count applies vertically.
Pixel Density, PPI and DPI
Density describes how tightly pixels are packed, measured in pixels per inch (ppi) or dots per inch (dpi). The ratio is a software value, while ppi is a hardware fact tied to inches of glass. Two phones can share a ratio of 3 and still differ in ppi, because their physical sizes differ. The ratio tells you how the browser scales; the density tells you how sharp the panel looks in your hand.
Using the Screen Checker to Read Your Display
Open the page and the screen checker fills in each value on its own. It queries standard browser APIs, so nothing is typed and nothing is stored, which keeps your privacy intact. Beyond the ratio you see the available screen area, orientation, touch support and color depth (colour depth). The tool reports screen dimensions only and cannot read your hardware model or serial number, and browser settings can change what it reports. The display specs report checks your input against current best practices and flags anything worth fixing.
Screen Resolution, Viewport Size and Screen Size
Your screen resolution in the browser is a CSS-pixel figure for the whole display. The viewport size is only the page area inside the window, so the viewport is smaller than the screen size once toolbars and the taskbar take their share. Resize the window and the viewport updates live while the screen figures stay put. Web designers care about the viewport; people comparing monitor resolution care about the screen.
Native Resolution Versus Scaled Resolution
A monitor's native resolution is its true physical resolution, but your operating system often shows a scaled resolution. Multiply the scaled width and height by the ratio and you recover the physical figures. When the result is lower than the advertised native number, check your OS display settings, because a non-native setting makes text look soft.
Common Screen Resolution Sizes and Monitor Types
This resolution checker reference lists the sizes you will meet most often, and a standard monitor is usually 1080p. A 1080p monitor can report 1920 × 1080 at a ratio of 1 or 1536 × 864 at 1.25, depending on scaling.
| Name | Pixels | Aspect ratio |
|---|---|---|
| HD | 1280 × 720 | 16:9 |
| Full HD (1080p) | 1920 × 1080 | 16:9 |
| QHD | 2560 × 1440 | 16:9 |
| Ultrawide QHD | 3440 × 1440 | 21:9 |
| 4K UHD | 3840 × 2160 | 16:9 |
Aspect Ratio and Ultrawide Displays
The checker's number is a density scale, not an aspect ratio, yet the screen width and height it shows also give you your aspect ratio. The aspect ratio compares width to height, so 16:9 is the widescreen norm and an ultrawide monitor stretches to 21:9. The aspect ratio does not change the density scale; a 4K panel can report 1 or 2 depending only on its scaling setting.
Checking Your Pixel Ratio in Browser Developer Tools
Web developers can confirm the number without any tool:
- Open the browser console.
- Type
window.devicePixelRatioand press Enter. - Zoom the page, then repeat to see the value change.
Display Scaling Formula and Worked Example
Display scaling links the three numbers this checker reports:
$$\text{DPR} = \frac{\text{physical pixels}}{\text{CSS pixels}} \qquad \text{CSS size} = \frac{\text{physical size}}{\text{DPR}}$$
Take a 3440 × 1440 ultrawide monitor with Windows scaling set to 125%, so the ratio is 1.25. The CSS width is \(3440 \div 1.25 = 2752\) and the CSS height is \(1440 \div 1.25 = 1152\). Your browser therefore reports a screen of 2752 × 1152 and a ratio of 1.25, and multiplying back returns the full native resolution. Raise the scaling to 150% and the same panel reports 2293 × 960 at 1.5 (rounded), so text grows while the physical pixels stay fixed.
Windows Scaling and Browser Zoom
Windows scaling sets the base ratio, and browser zoom multiplies on top of it. At 125% scaling, zooming the page to 200% makes the browser report a ratio of 2.5. That is why the value moves when you press Ctrl and plus.
Sharp Images and Web Design at High Pixel Density
Read the ratio from the checker, multiply your CSS width by it, and you have the pixel width to export for responsive images. A photo displayed at 400 CSS pixels wide needs about 800 pixels of data on a ratio-2 screen to stay crisp, otherwise the image quality drops and edges blur.
Using the Checker's Ratio to Size a Hero Image in Device Pixels
Marta is a freelance front-end developer, and a client says the hero banner on their new landing page looks soft on her Windows laptop. The banner is displayed at 720 CSS pixels wide, and she exported a 720-pixel file, assuming that was enough. Before touching the file, she opens the checker to see what her own screen really does.
The checker reports a screen of 1463 × 914 and a ratio of 1.75. Her panel is 2560 × 1600 and Windows scaling is set to 175%, so the numbers agree: 2560 ÷ 1.75 is 1462.9 and 1600 ÷ 1.75 is 914.3, both rounded by the browser. At that ratio, a 720-pixel image is stretched across 720 × 1.75 = 1260 device pixels, so the browser is inventing the missing detail and the edges blur.
| Scaling | Ratio | Pixels needed for a 720 CSS-pixel banner |
|---|---|---|
| 150% | 1.5 | 1080 |
| 175% (her setting) | 1.75 | 1260 |
| 200% | 2 | 1440 |
The sensitivity run settles the decision. Her laptop needs 1260 pixels, but the client's 200% monitor needs 1440, so she exports the banner at 1440 pixels wide, the common 2x export, and lets the browser scale it down. A 1260-pixel file would look perfect for her and soft for the client. The number to watch is the highest ratio among your real visitors, not your own.
One caveat she checks last: browser zoom multiplies the ratio. At 125% zoom her 1.75 becomes 2.1875, and the same banner then wants 1575 pixels, so a 1440-pixel file is still acceptable there. The checker answers what your screen does, not what every visitor's screen does, so it is the starting point and not the whole test.
Phone Screen Resolution Checker Results by Brand
These reference values come from published screen specifications for each phone, tablet and laptop. The viewport figures are CSS pixels, the way a browser reports them, so your own result should match the row for your device. Find your device in the lists below and compare its resolution and screen figures with the checker. A different ratio on the same device usually means a changed scaling mode, because each device keeps one physical resolution but can offer several scaled resolutions.
Android Phone Screen Resolution Buckets
Android groups densities into buckets, and the checker's ratio maps straight to one: a ratio of 3 is the xxhdpi bucket. Android phones range from about 2.6 to 3.5, so a flagship and a mid-range Android device give different resolution results on the same website. The Android system picks a bucket from the panel density, and each Android release rounds it a little differently, so an Android phone from Samsung and an Android phone from Google with a similar screen size can land in different buckets. Chrome on Android reports the system value directly, which means the number you see in the checker is the number Android uses for every app and every image it scales. Every Android device reports its own resolution and screen density, so check the Android device row on this screen first.
Apple iPhone Pixel Ratios on iOS
Every iPhone with an OLED panel reports 3, and the older LCD models report 2. The iOS value is fixed per model, and every browser on iOS uses the same WebKit engine, so Safari and Chrome on iOS give the same number. Each iOS device has one fixed resolution, so an iOS screen check on an iPhone gives the same answer every time.
- iPhone 16 Pro Max, an Apple device on iOS 18: resolution 1320 × 2868, physical screen size 6.9 inches, viewport size 440 × 956, density 460 ppi, ratio 3.
- iPhone 16 Pro, an Apple device on iOS 18: resolution 1206 × 2622, physical screen size 6.3 inches, viewport size 402 × 874, density 460 ppi, ratio 3.
- iPhone 16 Plus, an Apple device on iOS 18: resolution 1290 × 2796, physical screen size 6.7 inches, viewport size 430 × 932, density 460 ppi, ratio 3.
- iPhone 16, an Apple device on iOS 18: resolution 1179 × 2556, physical screen size 6.1 inches, viewport size 393 × 852, density 460 ppi, ratio 3.
- iPhone 15, an Apple device on iOS 17: resolution 1179 × 2556, physical screen size 6.1 inches, viewport size 393 × 852, density 460 ppi, ratio 3.
- iPhone 14, an Apple device on iOS 16: resolution 1170 × 2532, physical screen size 6.1 inches, viewport size 390 × 844, density 460 ppi, ratio 3.
- iPhone 13 mini, an Apple device on iOS 15: resolution 1080 × 2340, physical screen size 5.4 inches, viewport size 375 × 812, density 476 ppi, ratio 3.
- iPhone SE (3rd generation), an Apple device on iOS 15: resolution 750 × 1334, physical screen size 4.7 inches, viewport size 375 × 667, density 326 ppi, ratio 2.
- iPhone 11, an Apple device on iOS 13: resolution 828 × 1792, physical screen size 6.1 inches, viewport size 414 × 896, density 326 ppi, ratio 2.
Samsung Galaxy Pixel Ratios on Android
Galaxy flagships keep the 360-wide viewport on 1080p screens, while the Ultra line moves to a 1440-pixel-wide panel.
- Samsung Galaxy S25 Ultra, a Samsung Android device on Android 15: resolution 1440 × 3120, physical screen size 6.9 inches, viewport size 412 × 891, density 498 ppi, ratio 3.5 (a fractional Android bucket).
- Samsung Galaxy S24, a Samsung Android device on Android 14: resolution 1080 × 2340, physical screen size 6.2 inches, viewport size 360 × 780, density 416 ppi, ratio 3, xxhdpi (the Android xxhdpi bucket).
- Samsung Galaxy S23, a Samsung Android device on Android 13: resolution 1080 × 2340, physical screen size 6.1 inches, viewport size 360 × 780, density 425 ppi, ratio 3, xxhdpi (the Android xxhdpi bucket).
- Samsung Galaxy S22, a Samsung Android device on Android 12: resolution 1080 × 2340, physical screen size 6.1 inches, viewport size 360 × 780, density 425 ppi, ratio 3, xxhdpi (the Android xxhdpi bucket).
- Samsung Galaxy S21, a Samsung Android device on Android 11: resolution 1080 × 2400, physical screen size 6.2 inches, viewport size 360 × 800, density 421 ppi, ratio 3, xxhdpi (the Android xxhdpi bucket).
Google Pixel and Other Android Phones
Pixel phones use a fractional ratio, so their viewport is not a whole-number fraction of the panel resolution.
- Google Pixel 9, a Google Android device on Android 14: resolution 1080 × 2424, physical screen size 6.3 inches, viewport size 411 × 923, density 422 ppi, ratio 2.625 (a fractional Android ratio).
- Google Pixel 8a, a Google Android device on Android 14: resolution 1080 × 2400, physical screen size 6.1 inches, viewport size 411 × 914, density 430 ppi, ratio 2.625 (a fractional Android ratio).
- Google Pixel 7, a Google Android device on Android 13: resolution 1080 × 2400, physical screen size 6.3 inches, viewport size 411 × 914, density 416 ppi, ratio 2.625 (a fractional Android ratio).
Apple iPad and Mac Pixel Ratios on macOS
Tablets and laptops from Apple report 2, though macOS can also offer scaled modes that change the viewport. In the macOS display settings, a larger-text mode shrinks the viewport while the panel resolution stays the same, and iPadOS keeps one fixed viewport resolution per device model.
- Apple iPad Pro 11-inch (M4), an Apple device on iPadOS 17: resolution 1668 × 2420, physical screen size 11 inches, viewport size 834 × 1210, density 264 ppi, ratio 2.
- Apple iPad Air 11-inch (M2), an Apple device on iPadOS 17: resolution 1640 × 2360, physical screen size 10.9 inches, viewport size 820 × 1180, density 264 ppi, ratio 2.
- Apple iPad mini (7th generation), an Apple device on iPadOS 18: resolution 1488 × 2266, physical screen size 8.3 inches, viewport size 744 × 1133, density 326 ppi, ratio 2.
- MacBook Air 13-inch (M3), an Apple device on macOS Sonoma: resolution 2560 × 1664, physical screen size 13.6 inches, viewport size 1470 × 956, density 224 ppi, ratio 2.
- MacBook Pro 14-inch (M4), an Apple device on macOS Sequoia: resolution 3024 × 1964, physical screen size 14.2 inches, viewport size 1512 × 982, density 254 ppi, ratio 2.
Frequently Asked Questions
- What is device pixel ratio?
- Device pixel ratio is the number of physical display pixels used to draw one CSS pixel. It is 1 on a standard monitor at 100% scaling, 2 on most Retina and high-density screens, and a fractional value such as 1.25 or 1.5 at some Windows scaling levels.
- How do I find my device pixel ratio?
- Open a device pixel ratio checker and read the value your browser reports, or type window.devicePixelRatio into the browser console. Enter that number with your screen width and height here to see the matching physical resolution.
- Why does my screen resolution look lower than my monitor's native resolution?
- Browsers report resolution in CSS pixels, which your operating system scales. Multiply the reported width and height by the pixel ratio to recover the physical resolution, which can still differ from the advertised native figure when scaling is not a whole number.
- What is the difference between screen size and viewport size?
- Screen size is the whole display in CSS pixels. Viewport size is only the page area inside the browser window, so it is smaller once toolbars and the taskbar take space, and it changes when you resize the window.
- Why does my pixel ratio change when I zoom the browser?
- Browser zoom multiplies the system scaling. At a base ratio of 1.75, zooming the page to 125% reports 2.1875, so the value moves each time you change the zoom level.
- Can a website see my exact screen size in inches?
- No. Browsers do not expose the physical diagonal, so the estimate here uses a credit card calibration. Hold a standard 85.6 mm card against the display, match its on-screen width and the tool estimates width, height and diagonal.
- How accurate is the device type estimate?
- It is a rough guess based on touch support and the shorter screen side, so treat the Low–Medium confidence label seriously. Browser privacy settings, connected displays and permissions can all change what is reported.