> For the complete documentation index, see [llms.txt](https://shoppad.gitbook.io/pagestudio/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://shoppad.gitbook.io/pagestudio/readme/preview-your-page-on-different-sized-screens.md).

# Preview your page on different sized screens

Follow the steps below on how to preview your page on different-sized screens (like mobile).

1. Starting from the Page Studio editor, click on a content block on your page to reveal the top text toolbar.
2. Click on the **three-dot icon** within the white menu bar at the top to reveal more advanced settings.

<figure><img src="https://2399025339-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Flklrekxvi2ofo3eXbyBY%2Fuploads%2FdDjufT1lznqjzxzFnCl1%2FPS-add-new-page.png%20-%20Step%205.png?alt=media&amp;token=c3e61b06-42df-4d7f-8d73-a483cd0c9a41" alt=""><figcaption></figcaption></figure>

3. Then, click on the preview **eye icon**.

<figure><img src="https://2399025339-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Flklrekxvi2ofo3eXbyBY%2Fuploads%2FzlrnbujVBXYHZKnhliLM%2FPS-add-new-page.png%20-%20Step%206.png?alt=media&amp;token=b7fa12c4-f5b7-4bd5-9924-fed810586041" alt=""><figcaption></figcaption></figure>

4\. Use the gray top bar to freely adjust the view from mobile view to desktop view.

{% hint style="info" %}
If you would like to quit out of the preview mode, you can click on the **X icon** on the top right-hand corner.&#x20;
{% endhint %}
