Familiar VS Code-style editing, free and entirely in your browser.
If you've spent time in Visual Studio Code, this editor should feel like home from the first keystroke.
The editing surface here is built on Monaco — the open-source editor component that Microsoft develops and ships inside VS Code itself. Because it's the same core, the day-to-day feel matches: the gutter with line numbers, bracket-pair highlighting, the completion popup, inline error squiggles, and the smooth caret movement all behave the way your fingers expect.
One honest distinction up front: this is a VS Code-style browser editor, not the full desktop application. It gives you the editing experience without an install — but it doesn't replace the desktop app's extensions, terminal, or debugger. More on exactly where each one fits further down.
The browser build of the same editor found in VS Code, with syntax highlighting for HTML, CSS, JavaScript and dozens of other languages.
Tag, attribute, and property suggestions appear as you type, with quick-info on hover — the same assist you lean on in the desktop app.
Matched brackets highlight together and long blocks collapse from the gutter, so you can focus on the one region you're editing.
A comfortable dark editing theme with the familiar syntax color roles, running inside a browser-based code editor — no install, no setup.
A condensed map of the file runs down the edge, so you can see the shape of a long document and jump to a region without scrolling line by line.
Search the current file, toggle case-sensitive or whole-word matching, and switch on regular expressions for pattern-based replacements across the document.
The keybindings you reach for without thinking mostly carry straight over. Here are the ones worth confirming on day one.
Ctrl/Cmd + D — select the next occurrence of the current word and add a cursor to it.
Alt + Click — drop an extra cursor anywhere for true multi-cursor editing.
Ctrl/Cmd + / — toggle a line comment on the current line or selection.
Alt + ↑/↓ — move the current line up or down without cut and paste.
Shift + Alt + ↓ — duplicate the current line directly below it.
Ctrl/Cmd + F — find in file; add Alt + Enter to select every match at once.
Ctrl/Cmd + G — jump straight to a line number in a long file.
Tab / Shift + Tab — indent or outdent the whole current selection at once.
A handful of desktop shortcuts belong to the browser rather than the editor — Ctrl+W, Ctrl+T, and Ctrl+N close tabs and open windows — so those stay with the browser. Everything that lives inside the editing surface itself works as you'd expect.
Both share the same editing core, so the real question isn't "which is better" — it's which one fits the task in front of you.
You're on a borrowed, school, or locked-down machine where you can't install software; you need to open a snippet in seconds; you're prototyping a component, teaching, or learning; or you just want to edit HTML, CSS, and JS with an instant preview. Nothing to download, nothing to update, and it behaves the same on Windows, macOS, Linux, or a Chromebook.
You depend on the extension marketplace, integrated Git, a built-in terminal, or a step-through debugger with breakpoints; you're working across hundreds or thousands of files; or you need offline tooling like package managers and build steps. That ecosystem is what the full desktop application is for.
For front-end snippets, landing pages, and learning, the browser editor removes every bit of setup friction. For full application engineering, the desktop app's ecosystem is hard to beat — and plenty of developers keep both, using the browser for quick edits and the desktop for deep work. When your quick edit grows into a real project, move it into a multi-file workspace or wire up the built-in JavaScript console to debug it.
The highlights above get you moving; this is the complete lookup table, grouped by task with both Windows/Linux and macOS bindings.
| Action | Windows / Linux | macOS |
|---|---|---|
| Multi-cursor & selection | ||
| Add cursor at next match | Ctrl + D | Cmd + D |
| Select all occurrences | Ctrl + Shift + L | Cmd + Shift + L |
| Cursor anywhere | Alt + Click | Option + Click |
| Add a cursor to each selected line | Shift + Alt + I | Shift + Option + I |
| Column (box) selection | Shift + Alt + drag | Shift + Option + drag |
| Line operations | ||
| Move line up / down | Alt + ↑ / ↓ | Option + ↑ / ↓ |
| Copy line up / down | Shift + Alt + ↑ / ↓ | Shift + Option + ↑ / ↓ |
| Delete line | Ctrl + Shift + K | Cmd + Shift + K |
| Insert line below / above | Ctrl + Enter / Ctrl + Shift + Enter | Cmd + Enter / Cmd + Shift + Enter |
| Toggle line comment | Ctrl + / | Cmd + / |
| Toggle block comment | Shift + Alt + A | Shift + Option + A |
| Indent / outdent selection | Tab / Shift + Tab | Tab / Shift + Tab |
| Navigation | ||
| Go to line number | Ctrl + G | Ctrl + G |
| Jump to matching bracket | Ctrl + Shift + \ | Cmd + Shift + \ |
| Fold / unfold region | Ctrl + Shift + [ / ] | Cmd + Option + [ / ] |
| Start / end of file | Ctrl + Home / End | Cmd + ↑ / ↓ |
| Search, replace & assist | ||
| Find in file | Ctrl + F | Cmd + F |
| Replace in file | Ctrl + H | Cmd + Option + F |
| Select every find match | Alt + Enter | Option + Enter |
| Trigger suggestions | Ctrl + Space | Ctrl + Space |
| Format document | Shift + Alt + F | Shift + Option + F |
These live inside the editing surface, so they behave the same on every operating system. The only exceptions are combinations the browser claims first — closing tabs or opening windows — which stay with the browser rather than the editor. If a chord ever doesn't fire, click into the editor first so it holds keyboard focus, then try again.
The editing surface is genuinely the same core. The honest gaps are the desktop app's operating-system integrations. Here's the line-by-line picture.
| Capability | Desktop VS Code | This browser editor |
|---|---|---|
| Monaco surface (highlighting, folding, minimap) | Yes | Yes |
| IntelliSense-style completion for HTML/CSS/JS | Yes | Built-in |
| Multi-cursor & column selection | Yes | Yes |
| In-editor keyboard shortcuts | Yes | Yes |
| Find & replace with regex | Yes | Yes |
| Live preview of the page | Via extension | Built-in |
| Command palette of all commands | Yes | Core commands |
| Extension marketplace | Yes | No |
| Integrated terminal | Yes | No |
| Source control / Git panel | Yes | No |
| Step-through debugger & breakpoints | Yes | Console |
| Full local file-system access | Yes | Export |
| settings.json & Settings Sync | Yes | No |
| Works fully offline | Yes | Loads online |
Two gaps have friendly stand-ins: instead of the debugger you get the built-in JavaScript console, and instead of raw file-system access you can export your files at any time. For a fuller explanation of why a browser tab is sandboxed by design, see how a browser-based code editor works.
The shortcuts earn their keep when you chain them. Here are four moves worth building into muscle memory.
Put the cursor on a variable and press Ctrl/Cmd + D to grab each next match — or Ctrl/Cmd + Shift + L to select them all in one go — then type the new name once and every cursor updates together.
Hold Shift + Alt and drag to select a vertical block across many lines, then type once to prefix or edit them all. Perfect for turning ten plain lines into ten list items in a single stroke.
Use Alt + ↑/↓ to move the current line and Shift + Alt + ↓ to duplicate it. Reordering nav items or list rows takes seconds and never touches the clipboard.
Start a tag and accept the suggestion to auto-close it; press Ctrl + Space to force the popup when you want to browse attributes or CSS properties, and hover any token for quick info — the same assist you rely on in the desktop app.
Ctrl/Cmd+D), comment toggle (Ctrl/Cmd+/), move line (Alt+↑/↓), and find (Ctrl/Cmd+F) all carry over. A few combinations are reserved by the browser itself, like Ctrl+W and Ctrl+T, so those stay with the browser rather than the editor.settings.json or Settings Sync profile, so custom themes and remapped keys don't carry over. The default in-editor keybindings match VS Code, though, so anything you didn't personally rebind should feel identical.Ctrl/Cmd + D to add a cursor at the next match, Ctrl/Cmd + Shift + L to select every match at once, or Alt/Option + Click to drop cursors by hand — then type once and every cursor edits in lockstep.Full-featured HTML editor with live preview and Monaco engine.
Code on the left, live rendered output on the right.
Real-time preview that updates with every keystroke.
Unified editor for all three front-end languages.
Manage complex projects with multiple files and folders.
100% free editor — no fees, no restrictions, ever.
Monaco Editor, IntelliSense, multi-cursor, code folding — the full VS Code experience without installing anything.
Want to run your HTML, CSS, and JavaScript code instantly and see the result live? Try our free HTML Runner Online — a lightweight browser-based code runner and viewer with real-time live preview. No download or signup required.
Open HTML Runner Online