Code Editor
Code Editor puts VS Code’s editor in a browser tab. Open a folder from your disk and edit it with the same shortcuts, multi-cursor, minimap and TypeScript-aware autocomplete; Ctrl+S writes straight back to the file. No install, no account, and your files never leave your computer.
Features
- Monaco, the editor inside VS Code: same keyboard shortcuts, command palette (F1), multi-cursor, minimap, folding and sticky scroll
- Open a folder and save back to it (Chrome and Edge), or open a .zip, or keep a project in the browser
- TypeScript and JavaScript autocomplete, hover types, go to definition, find references and rename across the whole project
- Ctrl+P to jump to any file (name:line works), Ctrl+Shift+F to search and replace in all files with regex, case and whole-word options
- File explorer with new, rename and delete; tabs with unsaved marks; split the editor in two
- Syntax highlighting for about 80 languages, plus JSON, CSS and HTML validation
- Live preview of web projects (HTML/CSS/JS, React, TypeScript, npm packages) in a sandboxed frame, with a console and phone/tablet widths
- Templates: HTML/CSS/JS, React + TypeScript, a Node script
- A terminal with ls, grep, pipes and redirects, npm install from the npm registry, and node to run your scripts (TypeScript too) in a sandbox
- Settings for font size, tabs, word wrap, minimap and ligatures
- Works offline after the first visit; download any project as a .zip
How to use it
- Click Open folder and pick your project (or open a .zip, or try the sample).
- Edit with autocomplete; Ctrl+P jumps between files and Ctrl+Shift+F searches them all.
- Press Ctrl+S to save the file back to your disk.
FAQ
Are my files uploaded?
No. The editor runs entirely in your browser. A folder you open is read and written on your own disk; other projects are kept in this browser’s storage.
Which browsers can save to my disk?
Chrome and Edge (and other Chromium browsers) can open a folder and save to it. Elsewhere a folder opens as a copy kept in the browser, and you download your changes as a .zip.
Is this the real VS Code?
It uses Monaco, the editor at the heart of VS Code, so editing feels the same. It has its own terminal; VS Code’s extensions and debugger aren’t part of it.
Can I run npm install and node?
Yes, in the terminal (Ctrl+`). npm install downloads real packages from the npm registry and keeps them in your browser, and node runs your JavaScript or TypeScript in a sandbox. It isn’t a full Node.js: there’s no network, servers or native modules, so dev servers like Vite don’t run.
Does autocomplete understand my imports?
Yes: types flow across the project’s TypeScript and JavaScript files, and packages you npm install bring their types too.
More developer tools
API Studio
Build, test and automate HTTP requests right in your browser.
- API Studio: Build, test and automate HTTP requests: collections, environments, tests and a runner.
Diagrams
Draw cloud architectures and watch the data flow.
- Architecture Builder: Draw cloud architectures and data flows with AWS, Azure, GCP and 1,000+ components.
CI/CD
See, edit and check your CI/CD pipelines.
- Pipeline Studio: See and edit your Bitbucket pipelines as a metro map, with checks for mistakes Bitbucket would reject.
Data
Query, browse and edit data files and SQLite databases.
- Database Studio: Query, browse and edit CSV, Excel, Parquet and SQLite files with SQL, right in your browser. Nothing is uploaded.
System Design
Simulate traffic through a system design and find its limits.
- System Design Simulator: Design a system, send it traffic and watch where it melts: latency, errors and the bottleneck.
Team Knowledge
Every error your team has hit, and how it was fixed.
- Error Memory: Search every error your team has hit and how it was fixed; log new ones with their fix.
Codebase
How your services and flows really work.
- Code Flow Map: See how your codebase works: services and business flows, every step linked to its code.
Snippets
Your team’s reusable code, searchable.
- CodeVault: Your team’s library of reusable code: save, search, version and share snippets.
Editor
VS Code’s editor, in the browser.
- Code Editor: VS Code’s editor in the browser: open a folder, edit with autocomplete, save back to disk.
Formatters & Beautifiers
Make messy payloads, queries and markup readable.
- JSON & Log Formatter: Repair, beautify and deep-decode JSON, Python dicts and log lines.
- SQL Formatter: Pretty-print queries for 12 SQL dialects.
- XML / HTML Beautifier: Beautify or minify HTML and XML, with validation.
- JSON Diff: Compare two payloads side by side or as a change list.
- SQL Diff: Compare queries, scripts or schemas as SQL, with schema changes and the migration.
- JQ / JSONPath: Filter JSON with jq or JSONPath expressions.
Encoders & Decoders
Look inside tokens, encodings and escaped text.
- JWT Debugger: Decode tokens, check expiry and verify HMAC signatures.
- Base64 / Hex / Binary: Convert text and files between Base64, hex and binary.
- URL / Query Parser: Split, edit and rebuild URLs and query strings.
- HTML & Unicode Entities: Encode and decode HTML entities and Unicode escapes.
Generators
IDs, hashes, keys, placeholder text and typed code.
- UUID / ULID / Hash: Generate UUIDs and ULIDs; hash text or files.
- Lorem Ipsum: Placeholder paragraphs, sentences or words.
- RSA / EC Key Pair: RSA and EC key pairs as PEM or JWK, via WebCrypto.
- Schema & Code Generator: Turn sample JSON into TypeScript, Zod, Go, Rust, SQL and more.
Converters
Move data between formats, times and color spaces.
- Unix Timestamp ↔ Date: Convert Unix timestamps to dates and back.
- Color Converter: HEX, RGB, HSL and OKLCH with WCAG contrast checks.
- Cron Parser: Explain cron expressions and list upcoming runs.
- Format Converter: Convert between JSON, YAML, TOML, XML and CSV.
API & Debugging
Reproduce requests, read errors and sanitise logs.
- Log → cURL: Rebuild a runnable cURL from logs, HAR or fetch calls.
- HTTP Status Codes: Status codes with causes and fixes.
- Payload Redactor: Strip secrets and personal data before you share.
- Regex Tester: Test patterns live and explain them token by token.