Preview a website at phone, large phone, tablet, laptop and desktop screen sizes side by side to test responsive layouts, with adjustable zoom.
About this tool
Preview a website on phone, tablet, laptop and desktop screen sizes side by side.
How to use Responsive Design Checker
- Enter the website address and click Preview.
- Choose which devices to show and the zoom level.
- Scroll inside each frame to check menus, text size and layout at that width.
Worked example
If your navigation menu overlaps the logo only in the 768-pixel tablet frame, add a CSS breakpoint for that width.
Why is a frame blank?
Some sites refuse to be shown inside frames (X-Frame-Options or CSP frame-ancestors), so they cannot be previewed this way.
Is this the same as a real phone?
It uses the same widths, but not the phone’s browser engine or touch behavior. Test important pages on real devices too.
Explore Webmaster & SEO Tools · More practical guides