VS Code Editor — Code Online Free, Powered by Monaco
The real VS Code editing engine — Monaco, the same editor core that powers vscode.dev — running fully in your browser with a file explorer, tabs, and a live HTML preview.
Monaco editor core (MIT) by Microsoft — the editing engine behind VS Code and vscode.dev — vendored and served from this site. Files save to your browser only.
Keyboard Shortcuts
| Key | Action |
|---|---|
| Ctrl+S | Save workspace to browser storage |
| Ctrl+O | Open files from your device |
| Ctrl+B | Toggle the file explorer sidebar |
| Alt+Z | Toggle word wrap |
| F5 | Run/preview the active .html file |
| Alt+Click | Add another cursor |
| Ctrl+D | Select next occurrence of the current word |
| Shift+Alt+Up/Down | Copy line up / down |
| Ctrl+Shift+K | Delete line |
| Ctrl+/ | Toggle line comment |
| F2 | Rename symbol |
| Ctrl+Space | Trigger IntelliSense suggestions |
Helpful Tips
- 1The file extension decides the language: name a file .py, .go, or .rs and Monaco loads that language’s tokenizer and IntelliSense
- 2Run resolves relative paths against your workspace — keep index.html, style.css, and app.js together and the preview behaves like a real site
- 3Double-click a file in the explorer to rename it; the tab and model follow along
- 4Multi-cursor is the productivity unlock: Alt+Click to place cursors, then edit several lines at once; Esc returns to one cursor
- 5The workspace lives in this browser’s localStorage — use the download button to export a file before switching browsers or clearing site data
- 6Want the full VS Code shell (extensions, terminal, remote)? That requires the desktop app or a server — this embed deliberately stays serverless and private
Quick Answer
This free online code editor runs Monaco — the actual open-source editor core that powers VS Code and vscode.dev (MIT, by Microsoft) — entirely in your browser. Create and edit files with real IntelliSense, syntax highlighting for 30+ languages, multi-cursor editing, and VS Code themes, then press Run to preview HTML/CSS/JS live. Your workspace saves to your browser’s local storage: no install, no account, nothing uploaded.
How It Works
Click Launch — the editor (about 4 MB) loads straight into the page
Create a new file with the + button (the extension picks the language) or press Ctrl+O to open files from your device
Edit with full VS Code muscle memory: multi-cursor (Alt+Click), Ctrl+D, Ctrl+F, Shift+Alt+Up/Down to copy lines
Press Run or F5 on an .html file to preview it — sibling CSS/JS files are wired in automatically
Ctrl+S saves the workspace to your browser; it reopens exactly as you left it
Key Facts
- Powered by Monaco — the genuine VS Code editing engine, not a lookalike
- IntelliSense, multi-cursor editing, find & replace, and a minimap built in
- File explorer with tabs and 30+ languages detected automatically
- Live preview: Run any HTML file with local CSS and JS resolved from the workspace
- Autosaves to your browser only — fully private, fully offline-capable
Frequently Asked Questions
Is this the real VS Code?
It is the real VS Code editor core: Monaco, Microsoft’s open-source (MIT) editing engine, which is exactly what powers VS Code and vscode.dev — same highlighting, same IntelliSense services, same keybindings. The full VS Code shell around it (extension marketplace, integrated terminal, remote development) is not part of a serverless embed; this page wraps the engine with a file explorer, tabs, and a live HTML preview instead.
Where are my files saved?
In your browser’s local storage, on your device — the workspace autosaves as you type and reopens exactly as you left it. Nothing is uploaded to any server, and there is no account. To move a file elsewhere, use the download button in the explorer.
Which languages are supported?
Syntax highlighting and language services cover 30+ languages out of the box — JavaScript/TypeScript, HTML, CSS/SCSS, Python, Go, Rust, Java, C/C++, C#, PHP, Ruby, SQL, YAML, Markdown, JSON, XML, shell, and more. The file extension selects the language automatically.
Can I open a whole folder from my computer?
Yes — press Ctrl+O (or the upload button in the explorer) and select multiple files; folder trees come in with their relative paths preserved where the browser allows. Files are copied into the browser workspace, so your originals are never modified.
Does it work on phones and tablets?
It loads and works, and the sidebar collapses to an overlay on small screens — but a hardware keyboard is what Monaco is built around, so desktop or laptop is the intended experience.
Why not embed vscode.dev directly?
vscode.dev sends a strict frame-ancestors 'none' header, so it refuses to run inside any other site. Self-hosting the complete VS Code shell requires a server component (code serve-web or code-server) with auth and resources. The Monaco core keeps the whole thing static and private while preserving the actual editing experience.