`.html` and `.htm` files open as a live rendered page with a toggle to the source, so you can build a landing page, a prototype screen or a one-off report in Monofile. The same file also renders as an artboard on a canvas board, at a device viewport.
## Rendered by default, source on demand
Opening an HTML file shows the rendered page. Press Cmd + Shift + V (Ctrl + Shift + V on Windows and Linux) to switch to the source in the code editor, and again to go back to the render. Edits autosave like every other file, and every write captures a version.
Open the same file in two panes, source on the left and the live page on the right, and the preview follows your edits as you type.
## How the preview is sandboxed
The page renders inside a sandboxed iframe built from the file's own source. Scripts run, so an interactive prototype works. The document does not get your origin, so it has no access to your Monofile session, cookies or local storage, and cannot act as you.
> [!NOTE]
> The preview renders the file and nothing else. A page that pulls in a stylesheet or a script by relative path to another file in your workspace will not find it. Self-contained pages, with CSS and JavaScript inline, preview correctly.
## The same file as an artboard
Put an HTML file on a canvas board and the node becomes an artboard. The node's box is the viewport, so the page renders live at 1:1 inside it and the canvas scales it as you zoom. The node toolbar has three presets.
| Preset | Size |
|---|---|
| Mobile | 390 by 844 |
| Tablet | 820 by 1180 |
| Desktop | 1440 by 900 |
The node points at the file, so the same page can sit on a board three times at three widths and all three update when you save. Double-click a node to focus it and you can click and scroll inside the live page; Escape steps back out. [[Canvas Boards]] covers the rest of the board.
At very low zoom, or when a board holds more live pages than the render budget allows, a node shows a placeholder. Zooming back in brings the render back.
## HTML files are text files
An agent can write one with the ordinary file-write tool, or write the HTML and place it on a board in the same call. Agent changes arrive as a reviewable diff, every write captures a version, and you can share a page by link or publish it in a public folder.
## Next steps
:::cards
- [[Canvas Boards]] — Spatial boards of live file nodes, notes, links, groups and labelled edges.
- [[Code Files]] — Monaco-backed editing for every supported language, and what it gives you.
- [[Share Links]] — Secret per-file URLs with optional expiry, password and pinned content.
- [[Supported File Types]] — The full extension to editor map, and what each editor can do.
:::