Inspect Browser

Web Development Tools for iOS



Inspect is a fully featured web inspector that gives web developers the tools they need to develop for the web using only an iPad or iPhone.

Included are tools developers are used to on a desktop, but rarely found on mobile: JavaScript console, elements inspector and editor, and responsive design tools.

User Interface

The Inspect user interface should be familiar to most users in that it resembles a desktop web browser. Inspect User Interface

  1. Tab Bar

    The tab bar lists open tabs. Each tab can display a different site, and each tab contains it's own set of developer tools.

    • Tap the tab to switch to it.
    • Tap the Close Tab Button button on the tab to close it.
    • Tap the New Tab Button button on the right to open a new tab.
    • Long-press a tab then drag to switch the order of tabs.

  2. Tool Bar

    The tool bar contains navigation controls, the current website URL, and a few other tools.

    • Navigation Controls
      • Refresh Page Button: Tap to refresh the page.
      • Navigate Back Button: Tap to navigate back in history.
      • Navigate Forward Button: Tap to navigate forward in history.
    • Address Bar
      • This displays the current URL.
      • Tap to select, then type a different URL to navigate to a different site. Tap (Go) to navigate.
      • The number on the right of the address bar is the amount of time take to load the page.
      • Type in a search query rather than a URL to perform a search using DuckDuckGo (This behaviour is configurable in settings.)
    • Additional Tools
      • Take Screenshot Button: Take a screenshot of the website. This takes a screenshot of just the website, rather than the full screen you would get using the built-in iOS screenshot function.
      • Toggle Developer Panel Button: Tap to hide/show the developer tools.
      • Move Developer Panel Button: Tap to move the developer panel between the bottom and side of the screen.

  3. Web Page

    This area displays the current web page. By default it takes up this entire area, but may shrink when viewing the page using different device previews.

  4. Developer Panel

    This area displays the active developer panel.

  5. Developer Panel Buttons

    These buttons allow you to select the developer panel to display.

Developer Panels

Most of Inspect’s core functionality is contained within it’s developer panels. Each of these panels provides a certain type of tool to help you work with the currently loaded web page.

Keyboard Shortcuts

If you have a keyboard attached to your device, you can access a list of keyboard shortcuts by holding the "command" key (⌘). There are several shortcuts supported by Inspect:

Reload Page⌘ R
Go Back⌘ [
Go Forward⌘ ]
Open Location⌘ L
New Tab⌘ T
Close Tab⌘ W
Show Previous Tabcontrol shift tab
Show Next Tabcontrol tab
Toggle Developer Tools⌘ option i
Switch to JavaScript console⌘ option c
Switch to Elements panel⌘ option e
Switch to Design panel⌘ option r
Switch to Projects panel⌘ option p
Switch to Themes panel⌘ option t
Switch to Source panel⌘ option u
Switch to Setting panel⌘ option s

Frequently Asked Questions