A Practical Guide to Vim in the Browser

Vim is a modal editor: instead of one mode where every key types a character, Vim has separate modes for moving around, typing text, and running commands. That single idea is what makes Vim fast once it clicks. This guide walks through the model from scratch using the editor on this site, so you can practice every concept as you read it.

Why modal editing is worth learning

In a normal text box, your keyboard is dedicated to inserting characters. To do anything else, you reach for the mouse or a modifier key. Vim flips this around. Most of the time you are in Normal mode, where letters are commands: j moves down, w jumps to the next word, dd deletes a line. You only enter Insert mode when you actually want to type. Because the commands are short and composable, common edits take a keystroke or two instead of a trip to the mouse.

The four modes you will use here

  • Normal — the home base. Navigate and run editing commands. Press Esc to return here from any other mode.
  • Insert — type text like a regular editor. Enter it with i, a, or o.
  • Visual — select a range of text to act on. Enter it with v.
  • Command — type a colon command such as :w to save. Enter it with :.

Moving around without arrow keys

The first habit to build is movement. In Normal mode, the keys h, j, k, and l move left, down, up, and right. Keeping your hand on the home row means you never reach for the arrow keys. A few larger jumps save even more time:

  • 0 jumps to the start of the line, $ jumps to the end.
  • gg goes to the top of the file, G goes to the bottom.
  • w and b hop forward and backward by word.

Spend a few minutes moving around a block of text using only these keys. It feels slow at first and then becomes automatic.

Entering text

There are several ways into Insert mode, and choosing the right one saves a movement step:

  • i inserts before the cursor; a appends after it.
  • A jumps to the end of the line and starts typing.
  • o opens a new line below and O opens one above.

When you are done typing, press Esc to go back to Normal mode. New Vim users often stay in Insert mode out of habit; training yourself to tap Esc the moment you stop typing is what unlocks the rest of the commands.

Editing with operators

The real power of Vim is that editing commands compose. An operator like d (delete) combines with a motion to describe exactly what to change. x deletes the character under the cursor, and dd deletes the whole current line. As you learn more motions, the same operators reach further without new commands to memorize.

Copy, paste, and the clipboard

In Normal mode, yy yanks (copies) the current line and p pastes it after the cursor (P pastes before). These use Vim's own register, which is separate from your computer's clipboard.

To paste text you copied from another app or web page, use the system clipboard:

  • In Normal mode, type "+p to paste the computer's clipboard after the cursor ("+P pastes before it).
  • In Insert mode, press Ctrl/Cmd + V as you would anywhere else.
  • Or right-click and choose Paste, which works in any mode.

The first time you use "+p, your browser may ask for permission to read the clipboard. If it is blocked, the right-click Paste menu always works.

Saving your work

Saving uses Command mode. Press :, type the command, and press Enter:

  • :w writes (saves) the current file.
  • :wq also writes the file. In desktop Vim it would write and quit; in this browser editor there is nothing to close, so it behaves the same as :w.

In this browser editor, saving stores your file locally through your browser, downloads it, or—if you are signed in—keeps it in your cloud workspace so it is available on any device. You can open existing files from your computer at any time and keep editing them with full Vim keybindings.

A simple practice routine

  1. Open the editor and paste in a few paragraphs of text.
  2. Move only with h j k l and word motions for one minute.
  3. Delete a few lines with dd, then re-type them with o.
  4. Save with :w and confirm the file is stored.

Repeat that loop for a few days and the commands stop being something you think about. For a quick lookup while you practice, keep the Vim cheat sheet open in another tab.

Step-by-step how-tos

Short, focused walkthroughs of the tasks people search for most:

Looking for something else? Browse all documents for the full list of guides, tutorials, and references.

Open the editor and try it

Advertisement