What Is My Screen Resolution?
See how your screen is reported in real time, including CSS resolution, physical resolution, DPR, and pixel density. Use it to understand responsive behavior, compare browser-reported values, and get a clearer picture of how your display actually works. Learn more in our CSS Pixels vs Physical Pixels guide.
CSS Pixel Resolution
pixels
CSS pixels are the logical units websites use for layouts, media queries, and responsive design.
Resize your browser window to see live updates
What does my screen resolution mean?
Your screen resolution is the width and height of your display in pixels. On the web, there are two values that matter most: CSS resolution and physical resolution. CSS resolution is what browsers use for layouts, breakpoints, and responsive design. Physical resolution is the actual number of hardware pixels on your display. If those numbers are different, your device likely has a higher device pixel ratio (DPR).
1×
How many physical pixels map to one CSS pixel
94
Estimated pixel density in pixels per inch
Landscape
Current screen direction and device posture
24-bit
How many colors your display can show
Detailed Specifications
These values update in real time based on your screen, browser window, and device characteristics.
For web design and responsive testing, CSS resolution is usually more useful than physical resolution.
CSS Pixels vs Physical Pixels
The most common point of confusion is the difference between CSS pixels and physical pixels. They are related, but they are not the same thing.
CSS Pixels
- • Used by browsers and web developers
- • Control layout width and media queries
- • Determine responsive breakpoints
- • Reflect logical display size, not hardware density
Physical Pixels
- • The actual hardware pixels built into your screen
- • Affect image sharpness and rendering detail
- • Usually higher on Retina and high-density displays
- • Often equal to CSS pixels multiplied by DPR
Why this matters
For developers
Responsive design depends on CSS pixels, not just physical resolution. Breakpoints like @media (max-width: 430px) target viewport width, not monitor hardware pixels.
For designers
Understanding viewport size and DPR helps you preview how layouts, images, and UI elements will actually appear across devices.
For everyday users
Resolution, scaling, and pixel density affect text sharpness, app layout, screenshots, and how much content fits on screen.
How to check your screen resolution
You can use the live checker above for the fastest answer. If you want to verify your resolution manually, here are the common ways to do it.
On Windows
Open Settings → System → Display, then look for Display Resolution.
On Mac
Open System Settings → Displays to see the active display resolution and scaling options.
In your browser
Use this page to instantly see your CSS resolution, estimated physical resolution, DPR, and pixel density.
Your Resolution Tier
Based on your current display data, your screen falls into the following category:
Active Tier
720p / HD
STANDARD HD DISPLAY
Resolution tiers help describe how sharp and detailed a display is. For web development, viewport width and DPR are often more useful than the display label alone.
Explore related tools and references
Device Database
Browse viewport sizes, PPI, DPR, and screen specs for real devices
Compare Devices
Compare screen size, resolution, and density side by side
CSS Pixels vs Physical Pixels
Learn how browsers map logical units to hardware pixels
Responsive Breakpoint Guide
Understand which breakpoints match real device ranges
Viewport Dataset
Explore device trends and common viewport clusters
What's My Resolution Tool
Return to the live checker anytime to test your current screen
Latest Devices
Browse recently added devices with screen size, resolution, PPI, and category data.
Trending Devices
See which devices people are checking most often right now.
Popular Device Comparisons
Compare screen specs, resolution, and pixel density between popular devices.
Frequently Asked Questions
What is screen resolution?
Screen resolution is the number of pixels displayed horizontally and vertically on a screen. It is usually written as width × height, such as 1920 × 1080. Higher resolutions can display more detail, but websites and apps may still use CSS pixels for layout.
What is the difference between CSS pixels and physical pixels?
CSS pixels are logical units used by browsers for layout and responsive design. Physical pixels are the real hardware pixels on your display. On high-density screens, one CSS pixel may map to multiple physical pixels, which is why the numbers are often different.
What is Device Pixel Ratio (DPR)?
Device Pixel Ratio is the relationship between CSS pixels and physical pixels on a screen. A DPR of 2 means one CSS pixel maps to 2 physical pixels in each dimension. Higher DPR screens usually look sharper because they pack more pixels into the same space.
Why is my browser resolution different from my monitor resolution?
Browsers often report CSS resolution instead of physical screen resolution. This happens because modern devices use scaling and DPR to make layouts easier to read and interact with. Your browser viewport can also be smaller than your full screen if the window is resized.
What resolution is best for web development?
For web development, CSS viewport width is often more important than physical resolution. Breakpoints, layouts, and responsive behavior are usually based on CSS pixels. That is why understanding viewport size and DPR is more useful than looking at hardware pixels alone.
Next Step
Need more screen and viewport data?
Explore real device specs, compare popular models, and understand how CSS pixels, physical pixels, and DPR affect responsive design.