Editor & files
The editor
Two editors in one, the command palette, split editors, tabs, search and replace, autosave and formatting, snippets and Emmet, settings and shortcuts, and the touch editor on phones.
Two editors, one project
On a laptop you get Monaco, the editor inside VS Code. On a phone or tablet you get a touch editor built on CodeMirror — bigger targets, a bottom bar (with Preview for live apps), a key bar above the keyboard, word wrap on by default, and sheets instead of side panels. Both open the same files with the same colours and snippets, and your theme (20 of them) recolours both.
Moving around
| Shortcut | Does |
|---|---|
| F1 or Alt + P | The command palette — every command (>), a line (:), a symbol (@, or # across the project) |
| Ctrl/⌘ + P | Go to file |
| Ctrl/⌘ + \ | Open the file to the side (up to three editors) |
| Alt + Shift + O | The outline of this file |
| Ctrl/⌘ + Shift + F | Search — and replace — across the project |
| Ctrl/⌘ + B | Show or hide the file explorer |
| Alt + Z | Zen mode: nothing but the code |
| Ctrl/⌘ + S | Save now (it autosaves anyway) |
| Alt + / or ? | Every shortcut, searchable |
Shortcuts are shown for your machine — ⌘ and ⌥ on a Mac, Ctrl and Alt elsewhere — and you can change any of them in Editor settings → Shortcuts. More in Split editors, the command palette and the outline.
Saving and formatting
Everything autosaves a moment after you stop typing. If two people save the same file at once without live collaboration, KODEO shows both versions and asks which to keep — it never overwrites your unsaved text silently.
Alt + Shift + F formats the file with Prettier, and Format on save does it every time. The project's .editorconfig and Prettier config are followed. The Timeline (Alt + Shift + H) takes you back to earlier versions. See Replace across files, format on save and the file timeline.
Writing faster
- About 110 snippets for common languages, your own and your workspace's snippets, and Emmet for HTML and CSS (type
ul>li*3and press Tab). - Suggestions know your whole project, and the types of installed packages.
- The breadcrumb above line 1 shows where you are; click a part to jump to a file or a symbol.
- Markdown and SVG files have a live preview; images, PDFs, audio and video open in viewers.
Settings
Editor settings (Ctrl/⌘ + ,, or the gear) sets font, size, line height, cursor, tab size per language, word wrap, teammates' name tags, Vim keys and more — with a live preview. They follow your account to every device. See Editor settings, Vim, your own snippets and the phone tools.
Still have a question about this?
Assist answers from this article — in any language.
Was this helpful?