My Screen Resolution

Your screen resolution is the number of pixels displayed horizontally and vertically on your monitor. A screen showing 1920 × 1080 means 1920 pixels across and 1080 pixels tall — roughly two million pixels in total. Higher resolutions generally mean sharper, more detailed images, though the physical size of your display also plays a role in how sharp things actually look.

Screen resolution vs viewport size: These are often confused. Your screen resolution is the native resolution of your physical display. Viewport size is how large the browser window's visible area is — it changes when you resize the window, zoom in, or open developer tools. Web developers care about viewport size more than screen resolution because that's what CSS media queries actually respond to.

Device Pixel Ratio (DPR) is the ratio between physical pixels and CSS pixels. A DPR of 2 means your display has twice as many physical pixels as CSS pixels — this is what Apple calls "Retina" display. A DPR of 1.5 or 2 is common on modern laptops and phones. This matters when designing graphics and icons — you want to serve 2x images on high-DPR screens to avoid blurriness.

Color depth (usually 24-bit on modern displays) determines how many colors your screen can show. 24-bit supports around 16.7 million colors, which covers the full sRGB gamut. Some HDR displays go to 30-bit or higher.

This tool reads all values directly from your browser using the Screen API and Window object. Nothing is sent to a server — everything you see is computed locally in your browser in real time. Resize your window and hit Refresh to see your updated viewport dimensions.

Common use cases: web developers checking their own display setup, designers verifying DPR before exporting assets, support teams asking users to share their display info for bug reproduction, and anyone who's just curious about their screen specs.