Responsive preview
Docs get read on every kind of screen, so the preview pane lets you check a page at different widths without leaving the editor or resizing your browser.
The width modes
The preview has four modes, and Atlas remembers the one you used last:
- Desktop renders the page at full width, the way most readers see it.
- Tablet frames the page at a 1032px viewport.
- Mobile frames the page at a 440px viewport.
- Responsive lets you drag the preview to any width you like.
Switching modes also resizes the pane to fit, so the device frame is never cut off.
Responsive mode
Responsive mode is for the in-between cases. Drag the edge of the preview to any width and the page reflows live, so you can find the exact point where a layout breaks and fix it.
Note
The preview shows the real rendered page from your preview server, so what you see at each width is exactly what readers get.