Safe Area Preview — Notch & Inset Visualization
See the safe area insets of your device visualized on a live phone mockup. The tool measures env(safe-area-inset-top/right/bottom/left) directly from your browser, highlights the areas covered by the notch, status bar, rounded corners, and home indicator, and shows the raw values so you can build notch-aware layouts with confidence.
On notched phones the top inset represents the notch height and the bottom inset the home indicator height. On desktop and non-notched devices all insets read zero.
Safe Area FAQ
Does this work on all browsers?
Our mobile testing tools work best on modern browsers (Chrome, Firefox, Safari, Edge). Some features may not be available on older browsers that lack Web API support.
Is my device data collected?
No. All device information is read locally from your browser APIs. No data is transmitted to our servers or stored anywhere.
Is it free to use?
Yes. This tool is completely free with no usage limits, sign-up requirements, or hidden fees.