Skip to content
| Marketplace
Sign in
Visual Studio Code>Visualization>AtriumNew to Visual Studio Code? Get it now.
Atrium

Atrium

vegadevshop

|
16 installs
| (0) | Free
Click any .html or .md file in the Explorer to see it rendered, not the source. Markdown becomes styled HTML; full HTML pages render in a sandboxed iframe with relative URLs resolved. Right-click → Open With → Text Editor when you want to edit.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Atrium

Render .html and .md files inline in VS Code instead of opening source.

Clicking a markdown or HTML file in the Explorer renders it as a real page — styled markdown, full HTML documents in a sandboxed iframe with relative URLs resolved. Right-click → Open With → Text Editor when you want to edit.

What it renders

  • Markdown → styled HTML. Headings, lists, code blocks, tables, task lists, blockquotes, links, images.
  • Full HTML documents (anything with <!DOCTYPE> or <html>) → sandboxed srcdoc iframe. Relative URLs are rewritten to webview URIs so images, stylesheets, and inline scripts work the way they do in a browser.
  • HTML fragments (no <html> wrapper) → inline against the file's directory as base.
  • Both live-reload when the file is saved on disk.

Copilot Chat integration (optional)

Atrium registers a URI handler at vscode://vegadevshop.atrium/open?file=<absolute-path>. Any time Copilot Chat (or anything else that emits vscode:// links) ends a response with a link in that format, clicking opens the file directly in Atrium's renderer — no Explorer hunt, no source tab.

Wire Copilot into this by adding to your .github/copilot-instructions.md:

## File references

Whenever I create or edit an `.html` or `.md` file, end the response with:

[label](vscode://vegadevshop.atrium/open?file=<urlencoded-absolute-path>)

<urlencoded-absolute-path> is the file's absolute path through encodeURIComponent.

Settings

None required. Optional: workbench.editorAssociations if you want different defaults for a specific file type. To edit .md as source instead of preview, add:

"workbench.editorAssociations": {
  "*.md": "default"
}

Why a custom editor?

VS Code's built-in markdown preview is a command (Cmd+Shift+V), not a default editor — you have to invoke it each time, and there's no equivalent for HTML at all. Atrium fills the niche of "click a file, see the render, period," for both formats.

Commands

Command What it does
Atrium: Open File in Atrium Programmatic — opens an absolute path in the renderer. Used by the URI handler.
Atrium: Check for Updates Polls the Marketplace; offers to install if a newer version exists.

License

MIT

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft