Skip to docs content

Documentation

Everything you need to know about using Kbn. From basic setup to advanced features.

Getting Started

Kbn is a personal kanban board that runs entirely in your browser. No account, no server, no setup. Your data is stored in localStorage and never leaves your device.

  1. Open the board — you'll see a "Welcome" project with sample tasks
  2. Click the + button in the top tab bar to create a new project
  3. It starts with To Do, In Progress and Done — rename them or add your own
  4. Click + on any column, or press N to create a task in whichever column you are focused on in the column you are focused on
  5. Drag tasks between columns, edit them, add tags and priorities

That's it. No configuration required. Everything else is optional power features documented below.

Projects & Boards

Kbn organizes work into projects, each containing one or more boards. Think of a project as a repo and boards as different views (e.g. "Frontend", "Backend", "DevOps").

Projects

Create a project with the + button in the top tab bar or via the command palette. Projects appear as tabs — click to switch, drag to reorder. Right-click (or click the ••• menu) to rename or delete.

Press number keys 1 through 9 to switch between projects by position.

Boards

Each project starts with a "Main" board. Add more boards from the project's dropdown menu or the command palette. When a project has multiple boards, a secondary tab bar appears below the project tabs.

Boards are independent — each has its own set of columns and tasks.

Columns

Columns represent workflow stages. Every new board starts with To Do, In Progress and Done, and you can rename, recolor, reorder or replace them.

Creating Columns

Click Add Column in the command palette or use the column menu. Choose a name and pick a color from the 8 available accent colors.

Column Actions

  • Rename — click the column menu → Rename
  • Change color — column menu → Change color
  • Move position — column menu → Move position, or drag the column
  • Sort by — column menu → Sort by (see Column Sorting)
  • Focus mode — column menu → Focus column (dims all other columns)
  • Delete — column menu → Delete (removes all tasks in the column)

Tasks

Tasks are the core unit of work in Kbn. Each task has content (written in any of 18 languages), optional tags, priorities, and due dates.

Creating Tasks

  • Click the + button on any column header
  • Press N to create a task in the first column
  • Press A to open Quick Add (natural language syntax)
  • Use the command palette → New task

New tasks inherit the default language and default priority from your settings.

Editing Tasks

Click any card to open the task editor, or focus a card with vim keys and press E. The editor is a slide-over panel with:

  • A plain text area, or the Monaco editor when the language is code
  • Language selector (18 languages)
  • Tag picker, with a field for creating new tags
  • Due date picker
  • Priority selector
  • Markdown preview toggle

Task Actions

  • Move — drag cards between columns
  • Copy as markdown — C on focused card
  • Copy git branch name — B on focused card
  • Open from anywhere — R opens Recent Activity; picking a task switches to its project and board
  • Archive — soft-delete via command palette or editor
  • Restore — hover an archived card, or use the editor footer or command palette. Archived cards are visible once you turn on Toggle archived tasks
  • Delete — D on focused card (with confirmation)

Card Previews

Task cards on the board show a rich preview: markdown headings, checkboxes, bold text, inline code, and clickable URLs. Code blocks show the language badge. Tags, priority and due date indicators are visible at a glance.

Code Editor

Plaintext and markdown tasks open in a plain textarea, which renders instantly. Pick any code language and the task switches to a full Monaco editor — the same one that powers VS Code — loaded on demand, so notes never pay for it.

Supported Languages

plaintextmarkdownjavascripttypescriptpythonrustgojavacc++c#htmlcssjsonyamlsqlshelldockerfile

Markdown Preview

When a task uses the markdown language, a preview toggle appears in the editor. Switch between editing raw markdown and seeing the rendered output.

Keyboard Shortcuts

Kbn is designed for keyboard-first usage. Press ? anywhere to see the full shortcuts dialog.

Navigation

Move downJ
Move upK
Move left (previous column)H
Move right (next column)L
Switch project by position1-9
Dismiss / clear focusEsc

Actions

New taskN
Quick addA
Edit focused taskE
Delete focused taskD
Copy task as markdownC
Copy git branch nameB
Focus columnF
Recent activityR
Focus search/
Show shortcuts help?

System

Command palette⌘K
Undo⌘Z
Redo⇧⌘Z

Command Palette

Press ⌘K to open the command palette — even while typing in an input. It provides instant access to every action in Kbn.

Available Commands

  • Create, rename, delete projects
  • Create boards, switch between boards
  • Add columns
  • Create, search, archive, restore, delete tasks
  • Copy task as markdown
  • Undo / Redo
  • Change layout, background, column sort
  • Toggle tags, dark mode
  • Toggle archived tasks
  • Export / import data
  • View recent activity
  • Navigate to homepage

Navigation

The palette supports sub-pages. When you select a category (e.g. "Switch project"), it drills into a sub-page. Press Backspace on an empty search to go back.

Filtering

Press / to filter tasks by text across the board. Esc clears the filter and a second Esc leaves the box, so the single-key shortcuts come back. Enter focuses the first match and hands off to J / K.

While a filter is active, a column with no match says No matches rather than offering to add a task the filter would immediately hide.

Quick Add

Press A to open the Quick Add bar. Type a task description using natural syntax:

Fix login bug #bug @In Progress

#tag — adds a tag  |  @column — targets a column

If no @column is specified, the task goes to the first column. A#tag matches an existing tag regardless of case or spacing, and creates the tag when there is no match.

@column accepts the full name with its spaces (@In Progress), the name without them (@inprogress), or any prefix that matches only one column (@in).

Tags & Priorities

Tags

Tags are yours to define. Open a task and type a name into the New tag field in the Tags panel — it is created, colored from the palette, and applied in one step. Click any tag to add or remove it from the task.

A new board starts with Bug, Feature and Chore. Name tags for the kind of work, not its status — the column already says where a task stands.

The next to a tag deletes it everywhere, removing it from every task that carries it. That is undoable with Cmd Z.

Priorities

Four priority levels: Urgent, High, Normal, and Low. Set in the task editor. The priority indicator shows as a colored dot on the card.

Set a default priority in Settings → Appearance → Board & Cards so new tasks inherit it automatically.

Due Dates

Set a due date on any task from the editor. Cards show a due date badge that changes color based on urgency:

  • Red — overdue
  • Amber — due today or tomorrow
  • Gray — due later

When a board has overdue tasks, the count appears in the header next to the search box. Kbn does not use browser notifications — they only fire while the tab is open and need a permission prompt, and the badge is accurate either way.

Focus Mode

Navigate to a column with vim keys and press F to enter focus mode. All other columns are dimmed, letting you concentrate on one workflow stage. Press F again or Esc to exit.

Column Sorting

Each column decides how its own cards are ordered. Open the column menu → Sort by, or use the command palette → Sort column.

  • Manual — the drag-and-drop order (default)
  • Priority — urgent first, unset priorities last
  • Due date — soonest first, undated tasks last
  • Recently updated — most recently edited first

A sorted column shows its sort in the header; click that label to go back to manual order. Sorting only changes the display — your manual order is remembered underneath, and dragging a card still works.

Customization

Open Settings from the gear icon in the top-right corner. Settings are organized into two tabs: Appearance and Account.

Layout

  • Standard — 320px columns, scrollable
  • Wide — 400px columns, more room for content
  • Fill — columns stretch to fill the screen evenly

Appearance

Found under the Appearance tab.

  • Dark / Light mode — toggle in Settings or command palette
  • Background patterns — None, Dots, Grid, Cross, Glow
  • Show/hide tags — toggle tag badges on cards

Defaults

Set preferences in Settings → Appearance → Board & Cards that apply to all new items you create:

  • Default Task Language — the language new tasks open in (e.g. TypeScript, Markdown)
  • Default Task Priority — priority assigned to new tasks (or "None")

These defaults save time when you consistently use the same setup.

Export & Import

Export

Command palette → Export data as JSON. Downloads a file containing all your projects, boards, columns, tasks, tags, and settings — exactly as Kbn stores them, so the file is easy to read and edit by hand.

Import

Command palette → Import data from JSON. Select a previously exported file to restore your data. Kbn names what will be replaced and with what before it commits, and the import is undoable with Cmd Z.

Undo / Redo

Kbn maintains a 50-step undo/redo history. ⌘Z to undo, ⇧⌘Z to redo. This covers all data changes (task edits, moves, deletions, column changes, etc.).

PWA & Offline

Kbn is a Progressive Web App. On supported browsers, you can install it as a standalone app on your desktop or phone.

  • Install — click the install prompt in your browser's address bar, or go to browser menu → "Install Kbn"
  • Offline — the service worker caches the app shell. Once loaded, Kbn works fully offline since all data is in localStorage

Pricing

Kbn is free. There are no plans, no tiers, no limits and no payments — every feature described on this page is available to everyone, forever.

Your data lives in your own browser, so there is nothing to meter. The optional account exists only to back that data up and sync it between your devices, and it is free too.