Missed the action at the 2018 Chrome Dev Summit? Catch up with our playlist on the Google Chrome Developers channel on YouTube. Watch now.

Simulate Device Orientation With Chrome DevTools

To simulate different device orientations from Chrome DevTools:

  1. Press Command+Shift+P (Mac) or Control+Shift+P (Windows, Linux, Chrome OS) to open the Command Menu.

    The Command Menu.
    Figure 1. The Command Menu

  2. Type sensors, select Show Sensors, and press Enter. The Sensors tab opens up at the bottom of your DevTools window.

  3. From the Orientation list select one of the preset orientations, like Portrait upside down, or select Custom orientation to provide your own exact orientation.

    Selecting 'Portrait upside down' from the 'Orientation' list.
    Figure 2. Selecting Portrait upside down from the Orientation list

    After selecting Custom orientation the alpha, beta, and gamma fields are enabled. See Alpha, Beta, and Gamma to understand how these axes work.

    You can also set a custom orientation by dragging the Orientation Model. Hold Shift before dragging to rotate along the alpha axis.

    The Orientation Model.
    Figure 3. The Orientation Model

Feedback

Was this page helpful?