What Is My Screen Resolution
whatismyscreenresolution.orgUnfortunately, a lot of this is hot garbage.
① Its display dimension and screen diagonal figures are just a figment, due to a fundamental error in understanding of CSS units. It works by measuring how many pixels a div that’s been given style `width:1em;height:1em` takes—trouble is, that has always given you and will always give you the answer 96, because CSS units don’t correspond to physical units. (Firefox tried doing that long ago with the mozmm unit, but it became apparent that there’s almost no legitimate use for it, and it can’t actually be known on most devices anyway, so browser makers gave up on the idea.) So in practice, it’s just assuming 96dpi times the device pixel ratio.
② If your device pixel ratio is anything but one (e.g. high-DPI, or if you zoom in or out and then reload the page), the display dimension and screen diagonal figures are even more wrong, because it divides screen dimensions (which are in CSS pixels) by DPI (which it has calculated in device pixels).
③ It makes an assumption about the device pixel ratio that simply isn’t valid: it may not actually correspond to the number of physical pixels. The example I’m most familiar with is how Firefox under Wayland doesn’t implement fractional scaling¹, but instead renders at the next integer up and downsamples. My laptop is 2560×1440 run at 1.5× scaling; it detects it as 3412×1920 at 2×. The browser simply doesn’t expose what you need to be certain about these sorts of things. And Chromium under XWayland is saying 1706×960 with device pixel ratio 1, because Chromium itself isn’t even aware of the proper size. (XWayland is running at 1× scaling and upsampling to 1.5×; I used to run the sway/wlroots/xwayland hidpi patches and run it at 3× and downsample to 1.5×, but stopped at some point because it was too much bother and there had been some change in the software.)
④ It assumes screen.colorDepth is telling the truth (which it may well not be; on my device it’s 32 when I believe it should be 24). (It also shows both colour depth and pixel depth, even though they’re the same thing, only both present for “compatibility reasons” per the spec.)
—⁂—
¹ There’s actually been an experimental implementation for almost three years <https://bugzilla.mozilla.org/show_bug.cgi?id=1707209>, but when I tried it back then I decided regretfully (the text rendering was beautifully crisp!) that it was unusable for a couple of reasons. Gonna switch back to sway-git and try it out again now, and they should actually care about bug reports now since the fractional-scale-v1 Wayland protocol has happened, whereas last time it was deemed too early for bug reports.
I tried the wayland fractional scaling in firefox and it did not work for me. It just looks blurry along with the misplaced menus.
I’m trying it now: text rendering is glorious, but there are still size and position issues in things like menus which commonly render them unusable (menus failing to open so you can’t even use them by keyboard). It’s reporting my screen size as 2275×1280, which is 4⁄3 of the expected 1707×960 (given dPR 1.5), which is weird and wonky.
All of a sudden I’m realising how dreadfully fuzzy in places the font rendering in Alacritty is. I knew it wasn’t perfect, but I’m not sure I can bear it any more. Oops.
Why do I need to consent to tracking cookies for this?
Because you're not blocking "Annoyances" using uBlock Origin. ;)
Well, makes one wonder - why a tool like this needs tracking at all :). If they want to measure usage, there are plenty of privacy-first alternatives.
I agree, it was mostly in jest and to spread awareness that these prompts can be blocked too (but they're not enabled by default because they occasionally break some functionality).
I clicked on do not consent and it worked fine.
You do not need to, you can also click 'do not consent'
Motorola Edge 20: gets the device resolution right (1018x2400) but somehow belives the screen resolution is only 432x960. I guess its using an incorrect dpi metric or something, but its not clear how or why.
You might be confusing PPI vs DPI.
All smartphones these days have different PPI than DPI.
https://graphicdesign.stackexchange.com/questions/6080/what-...
Please don’t use the terms PPI and DPI and try to distinguish between them: it’s subtle at best and highly contested; in general computing, there is no difference, the two terms are used completely interchangeably. Only in a few niches is any distinction meaningfully drawn. (And the question you’re citing was largely talking about a different field, and half of its answers are mostly nonsense too.)
The distinction you have is between what I’ll start by calling logical pixels and physical pixels. “Screen resolution” here is logical pixels, and “device resolution” physical pixels.
Web specs call these CSS pixels (px) and device pixels (calculable in JS by dividing a px quantity by `devicePixelRatio`—which is incidentally subject to change within a page’s lifecycle, due to things like zooming in or out or moving to a different monitor), using a baseline of (simplifying quite a bit, actually) 96 dpi.
Android calls the logical pixels density-independent pixels (dp), using a baseline of 160 dpi. (I think they’re the outlier in the size of their dp unit? Not sure how Apple works.)
Microsoft calls the logical pixels device-independent pixels, using a baseline of 96 dpi.
It reports my 12.9” iPad Pro (2018) as an 8.9” diagonal.
I know it’s because Safari lies for the sake of compatibility, but I thought there was an escape-hatch API or CSS trick to get real details?
Device Resolution: 1080 x 2400
Device inner Resolution: 1080 x 2105
DPR(Device Pixel Ratio): 1.7647058823529411
Display Dimensions: (width x height): 3.6" (9.2 cm) x 8.0" (20.4 cm)
Screen Diagonal: 8.8" (22.4 cm)
Color Depth (bits per pixel): 24
Pixel Depth: 24
Display Aspect Ratio: 0.45:1
Your Resolution Is: not a widescreen
Browser Viewport: 612 x 1193
Not very impressive, considering I'm portrait fullscreen on a Pixel 6. (Firefox for Android 121.0.1)
Here you go:
<script>
document.write('<b>Screen: </b>'+screen.width+' x '+screen.height);
</script>
Yes, I know, "document.write()", but then there's something for y'all to refactor too. Win-win.Since it's somehow able to determine a physical size for my monitor, it would be nice if it could also display my PPI. I'd find this useful when looking at monitors and comparing their pixel densities.
It doesn’t. The developer thought it did, but it actually just assumes 96dpi times the device pixel ratio (which is approximately the system scaling factor times the page zoom level).
I don't understand why it simultaneously gets it right and wrong...
> Your Screen Resolution is 1440 x 810
> Device Resolution: 1920 x 1080
Oooh, wait, I get it, it's because I have my default zoom set to ~130% for my shitty eyes.
More carrot related ads incoming.
I like it for showing me what my effective resolution is on my current scaling mode. I use a 4k 27" monitor and sometimes I forget what 125% is equivalent to.
It's off by a factor of 2.6 in each dimension on my S23. Although the device resolution seems right. Strange.
Physical dimensions are a bit off (it says diagonal 22.9" while my laptop is a 15.6")
I’m on an iPhone 14 and it’s telling me my screen resolution is 390 x 844.
I very much doubt that.
In a 9" tablet it says the screen diagonal is 6.2". That boy ain't right.
Looking at some of the other comments, I note that my Firefox font scaling is 130% and that's apparently part of the problem.
Wrong.