How to Use Vim Shortcuts to Navigate Your Web Browser

Use Vim Shortcuts Browser Featured

While Vim is a text editor designed to be used with keyboard shortcuts, browser extensions like Vimium let you navigate the Web using similar keybindings without ever touching the mouse. Using Vim shortcuts on your browser can help you get things done faster and more efficiently. In this tutorial, we show you how to use and configure Vimium on your favorite browser.

Also read: 8 Methods to Exit Vim Editor in Linux

Installing Vimium

Install Vimium on Chrome

To install Vimium on Chrome, or any other Chromium-based browser like Brave, go to the Vimium page on the Chrome Webstore and select “Add to Chrome,” opening a pop-up window. Select “Add extension” to add it to Chrome.

Vim On Browser Add Vimium

Install Vimium on Firefox

You can add Vimium-FF, a Vimium port for Firefox, from the Vimium-FF page on the Firefox browser ADD-ONS website.

On the Vimium-FF page, select “Add to Firefox.” On the pop-up window, select “Add” to install it on Firefox.

Vim On Browser Add Vimium Ff

Install Vimari on Safari

Vimari is a Safari port of Vimium. While Vimari has limited control compared to Vimium, it handles the basic navigation just fine. You can install Vimari from the App Store.

Vim On Browser Add Vimari

To enable the Vimari extension on Safari, select “Safari” from the menu bar and go to “Preferences.” Select the “Extensions” tab and check “Vimari.”

Vim On Browser Enable Vimari

Also read: 3 Useful VIM Editor Tips and Tricks for Advanced Users

Scrolling With Vimium

Scrolling is probably the most common thing you do on a webpage. With Vimium, you can use J to scroll down and K to scroll up. Pressing H and L lets you horizontally scroll to left and right. Press GG to go to the top of the page. Press Shift + G to go to the bottom of the page as you would do with Vim. You can even scroll down or up half a page by pressing D and U.

Opening a Link

To open a link, press F, which will give a unique label to each of the links for a particular webpage.

Vim On Browser Open Link Current Tab

To go to a link, type the displayed label on the link. If you want to type something in a text field, just type the label on the text field.

Press Shift + F to show labels that will open the links in a new page when you type a label.

Vim On Browser Open Link New Tab

Also read: How to Change the Default Search Engine in Various Browsers

Manipulating Tabs

To go to the left tab, press Shift + J and Shift + K for the right tab. If you are using Vimari, press Q and W to go to the left and right tabs. To close the current tab, press X. If you close a tab by mistake, you can restore it by pressing Shift + X. (This doesn’t work in Vimari)

If you have multiple tabs open, press Shift + T, then search and select the tab to open it.

Vim On Browser Find Tab

Navigating Your History

You can go to the previous page on your browser by pressing Shift + H. If you want to return to the page you just came from, press Shift + L.

Getting Out of Insert Mode and Text Fields

Pressing I will get you into insert mode, where you can use the regular browser shortcuts. For example, if you are on YouTube, pressing M will mute the audio instead of acting as a Vimium shortcut.

Vim On Browser Youtube Insert Mode

Whether you are in insert mode or just a text field like the search bar, you can get out of it to return to Vimium shortcuts by pressing Esc.

Also read: What Is Caret Browsing and How to Enable It in Your Browser

Configuring Vimium

You can configure and change the default Vimium shortcuts to your own preferences from the Vimium Options page.

Opening the Vimium Options Page

If you are on Chrome, select the extension icon next to the address bar, then select the three dots next to the Vimium extension and select “Options” to go to the Vimium Options page.

Vim On Brower Configuration Page Chrome

If you are using Firefox, right-click the Vimium icon next to the address bar and select “Manage Extension.” On the Extensions page, select the three dots next to the Vimium extension and select “Preferences.”

Vim On Brower Configuration Page Firefox

To see all of the available commands, select “Show available commands” next to the “Custom key mappings” box.

Vim On Brower Configuration Page

This will show the list of available commands and their corresponding keybindings on a pop-up window.

Vim On Browser Commands

You can modify keybindings for any of these commands.

Mapping and Unmapping a Key in Vimium

To use a certain key for executing a command, enter a map command in the “Custom key mappings.” The general format is:

map shortcutKey commandName

For example, to use the M key to mute or unmute a tab, enter the command:

map m toggleMuteTab

If you want to disable a Vimium shortcut, you can use the unmap command with the shortcut key. For example, if you want to disable the Vimimum shortcut /, enter the command:

unmap /
Vim On Browser Vimium Map Unmap

Select “Save Changes” after entering your commands.

The changes will take place when you visit a new page or reload an already opened page.

Configuring Advanced Options

Vimium has a couple of advanced options, like specifying the scroll step size when you press J/K/H/L, which you can tinker with and set to your own preferences. If you don’t like smooth scrolling, you can uncheck the “Use smooth scrolling” button from miscellaneous options.

To see the advanced options, select “Show Advanced Options” on the Vimium Options page.

Vim On Browser Advance Options

You can also download the configuration file for your current preferences and restore it to use the same shortcuts when you reinstall your browser or choose to use Vimium on a different browser.

To download a backup, select “Click to download backup” from the “Backup and Restore” menu.

Vim On Browser Backup Restore

Configuring Vimari

To configure Vimari, select the Vimari icon from the top bar of Safari, and a new window will pop up. On the pop-up window, select “Open Configuration File.”

Vim On Browser Vimari Open Config

You will see all the available commands in the bindings section. The keybindings are represented as key-value pairs, where the key is the command name for the shortcut, and the value is the shortcut key.

Vim On Browser Vimari Config

If you want to change a shortcut, select the shortcut key after the keyword and replace it with your own shortcut.

For example, if you want to use Shift + J and Shift + K to go to the left and right tabs, replace the lines:

"tabForward": "w",
"tabBack": "q",

with

"tabForward": "shift+k",
"tabBack": "shift+j",
Vim On Browser Vimari Remap

To disable a shortcut, leave the value as empty quotes. For example, if you don’t want X to close a tab, replace the line:

"closeTab": "x",

with

"closeTab": "",
Vim On Browser Vimari Unmap

Press Command + S to save the configuration. This new configuration will work on the webpages you open, or you can reload an already opened tab on Safari by pressing R to use the new configuration.

Also read: 10 of the Easiest Ways to Unblock Websites

Frequently Asked Questions

Is Vimium/Vimari secure?

Yes. Vimium/Vimari doesn’t talk to any servers and stores all your preferences locally.

Why doesn't Vimium/Vimari work on the browser's homepage?

Vimium and Vimari don’t work on some pages like the Chrome homepage, Chrome Webstore, and Safari homepage to coincide with the browsers’ policies.

What happens if a website has the same shortcut as Vimium's?

In normal mode, Vimium shortcuts will get priority. However, you can use a website’s regular shortcuts in insert mode.

Image credit: Colorful keyboards by 123FR Screenshots by Muhammad Munna

Subscribe to our newsletter!

Our latest tutorials delivered straight to your inbox

Muhammad Munna

Muhammad Munna is an Electrical Engineering student who is passionate about technology and writing. He loves to experiment with different techs and dig deep into them. In his free time, he can be found fiddling with his smartphone camera.