---
title: Get started
description: Run Vimputer from source, build a Vim-style navigation layer for Chrome, and see it in the HUD.
icon: rocket
---

## Requirements

- macOS with [Karabiner-Elements](https://karabiner-elements.pqrs.org) 16 or later.
- Node.js 22 and pnpm. There is no packaged app yet, so Vimputer runs from source.

## Run the app

Clone [methodacting/vimputer](https://github.com/methodacting/vimputer), then:

```bash
pnpm install
pnpm dev
```

Vimputer opens on **All shortcuts**: every binding in every layer, filterable by
layer and app.

![All shortcuts: the layer tree on the left, every binding with its layer on the right](/blume-assets/content/assets/screenshots/all-shortcuts.png)

## Vim keys in Chrome

This builds the Nav layer from the screenshots. In Chrome, <kbd>f</kbd> enters
Nav, where the home row scrolls the page.

1. **Add a Chrome layer**

    In the sidebar, choose **+** → **App** → Chrome. Bindings in this layer only
    fire while Chrome is frontmost.

2. **Add the Nav mode**

    Choose **+** → **Mode** and name it Nav. A mode is entered and left with keys;
    **Esc exits** is on, so <kbd>esc</kbd> leaves it.

3. **Enter Nav from Chrome**

    In the Chrome layer, add a binding on <kbd>f</kbd> whose action is **Activate
    layer** → Nav. Nav's **Enter with** now reads "F in Chrome".

4. **Bind the keys**

    In Nav, map <kbd>h</kbd> <kbd>j</kbd> <kbd>k</kbd> <kbd>l</kbd> to the arrow
    keys and <kbd>u</kbd> <kbd>d</kbd> to page up and down. For top of page, record
    <kbd>g</kbd>, choose **+ then**, and record <kbd>g</kbd> again; bind it to ⌘↑.
    <kbd>⇧</kbd><kbd>g</kbd> sends ⌘↓.

The layer page lists each binding with a column per moment. All of these act on
press.

![The Nav layer: nine bindings, entered with F in Chrome](/blume-assets/content/assets/screenshots/layer-list.png)

**Keyboard** shows the same bindings on their keys. Click a key to edit it.

![The Nav layer on the keyboard, with its bound keys lit](/blume-assets/content/assets/screenshots/layer-keyboard.png)

## Generate and try it

In **Settings → Karabiner**, **Generate and activate** writes
`~/.config/karabiner/karabiner.json` and switches Karabiner to the Vimputer profile.
**Test file** writes a copy elsewhere and changes nothing.

Switch to Chrome and press <kbd>f</kbd>. The HUD lists Nav's keys:

![The HUD showing Nav's bindings](/blume-assets/content/assets/screenshots/hud.png)

## Next

- [Bindings](/docs/authoring/bindings): tap, hold, chords, sequences, and timing.
- [Layers](/docs/authoring/layers): modes, groups, and precedence.
- [Recipes](/docs/recipes): common karabiner.ts patterns, rebuilt.
