View Modes

Aside from the default Responsive Mode, Sizzy offers several other View Modes that you can use to change how devices are arranged. The icons for the different view modes can be found on the right side of the Workspace Toolbar.

Document image

Here's an explanation of what the different view modes offer.

To use the hotkeys listed below, the focus must be anywhere on the app UI except the active webpage. In case a hotkey doesn't activate a mode, click somewhere outside the webpage, and try pressing the hotkey again.

Responsive Mode (Default; Hotkey D)

This mode lets you see multiple devices at once, set zoom levels, and switch layouts. To learn how to change the alignment of devices in responsive mode see Align modes.

Document image

Full mode (Hotkey =)

This mode makes Sizzy behave like a regular web browser that you can use for general testing with the added developer features that the app offers. One suggested workflow is to do most of your testing in Full Mode and go back to Responsive Mode or Resizable Mode for testing on multiple devices.

To enable this mode, click the Full Mode icon in the toolbar.

Document image

Resizable Mode (Hotkey -)

This is a way to quickly check how your website looks in different screen sizes and aspect ratios without using custom devices. Click the Resizable Mode button in the toolbar to access it.

Document image

To manipulate the size and aspect ratio of the viewport, click and drag the bars on the right and bottom edges of the browser window.

Document image

Focus Mode (Hotkey F)

Lets you choose one particular device to focus on and hides all the other devices in your workspace. To learn more, see Focus Mode.

Zen Mode (Hotkey Z)

This mode declutters the interface by hiding all of Sizzy's UI elements such as the toolbar, bottom bar, and debugging panel. To learn more, see Zen Mode.

Switching between view modes using Butler

In addition to using the toolbar and keyboard shortcuts, you can switch between modes by using Butler. To invoke Butler, press Ctrl+Shift+P on Windows/Linux, or Cmd+Shift+P on macOS.

In the search bar that pops up, write view to see all available view modes.

Document image

Updated 11 May 2022
Did this page help?