Skip to content
| Marketplace
Sign in
Visual Studio Code>AI>GrokbitNew to Visual Studio Code? Get it now.
Grokbit

Grokbit

Israel Richner

|
43 installs
| (1) | Free
Grokbit — VS Code client for xAI's Grok Build CLI — each session in its own editor tab, review edits in a diff before approving, @-mention files, resumable history, inline image/video, and voice. Requires the Grok Build CLI plus a SuperGrok or X Premium+ subscription (or an xAI API key). MIT, open-s
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Grokbit

License: MIT VS Code Unofficial

A VS Code UI for xAI's Grok Build CLI — not affiliated with or endorsed by xAI. Grok, Grok Build, and xAI are trademarks of xAI; this project uses those names only to describe what it's compatible with.

Based on phuryn/grok-build-vscode by Paweł Huryn, MIT License.

Grokbit is the friendly editor UI for Grok Build — ask questions, plan changes safely, review edits before they land, generate images & video, and dictate by voice. Each chat is its own editor tab. You do not need to use a terminal day to day.

Install the free grok CLI once, sign in (subscription or API key), and Grokbit is the GUI on top.

Install free from the VS Code Marketplace or Open VSX Registry

Grokbit in VS Code — a prompt and Grok's rendered response, each session in its own editor tab


Who this is for

  • Prefer a GUI over the terminal — chat, approve changes, and manage history without memorizing CLI commands.
  • Want a safety net — Plan first mode, permission cards, and inline diffs so you always see what will change.
  • Work in VS Code / Cursor / similar — Grok sits next to your files, not in a separate app.

Engineers can still use the CLI; this extension does not remove power features — it wraps them in plain language.


Requirements

  • VS Code 1.94+ (or a compatible editor — Cursor, Windsurf, VSCodium).
  • The Grok Build CLI (grok) on macOS, Linux, or Windows. A native Windows build is supported — no WSL required (WSL2 + Remote-WSL still works if you prefer it).
  • A login: either a SuperGrok or X Premium+ subscription (grok /login) or an xAI API key. Subscription unlocks Grok Build; an API key can also unlock additional models and grok-imagine. (Grok's free tier does not include the CLI agent.)
  • For voice control only (optional): ffmpeg on PATH, and a separate xAI API key for Speech-to-Text (pay-as-you-go — your CLI login does not cover it). See Voice control.

Install

1. Install the CLI and sign in.

macOS / Linux / WSL:

curl -fsSL https://x.ai/cli/install.sh | bash
grok /login

Windows (PowerShell):

irm https://x.ai/cli/install.ps1 | iex
grok /login

grok /login opens a browser and completes sign-in in one step. Prefer an API key? Get one at console.x.ai and set XAI_API_KEY in your shell or a workspace .env (the extension auto-loads it).

2. Install the extension.

From the Marketplace — search Grokbit, or:

code --install-extension grokbit.grokbit

Or build from source:

git clone https://github.com/irichner/grokbit-vscode.git
cd grokbit-vscode
npm install
npm run rebuild             # bump → package → reinstall → publish to Marketplace
# same as: ./scripts/install.sh  |  Windows: pwsh scripts\install.ps1
# local only: npm run rebuild -- --no-publish
# needs VSCE_PAT (Marketplace Manage) or: npx @vscode/vsce login Grokbit
# in a Grok chat: /rebuild

Reload VS Code (Ctrl+Shift+P → Developer: Reload Window) and click the Grok icon in the activity bar.

Tip: Right-click the Grok icon → Move To → Secondary Side Bar to park Grok on the right, next to other AI tools.

Uninstall: ./scripts/uninstall.sh (Windows: pwsh scripts\uninstall.ps1) or code --uninstall-extension grokbit.grokbit.


Quick start

  1. Open Grokbit (activity bar icon, or Ctrl/Cmd+;). The launcher lists sessions; New session opens a chat tab.
  2. Pick a starter on the welcome screen (or just type). Examples: Explain this project, Plan a change safely, Create an image.
  3. Press Enter to send. Grok streams an answer. While it works you may see Thinking… (turn on full thinking details in the gear menu if you want them).
  4. Approve actions. When Grok wants to edit a file or run a command, a permission card appears — review the inline diff, then Allow this change, Allow always, or Don't allow.
  5. Choose a mode (Agent / Plan first / Auto accept), model, and thinking depth from the bottom toolbar and gear menu.
  6. Come back later — history and launcher list past chats for this project so you can resume anytime.

Features & capabilities

Click any feature to expand.

Native session tabs + activity-bar launcher

Each chat lives in its own editor tab (like a document). The left activity bar is a launcher: recent sessions (up to 7), status dots, rename/delete, and New session. Full history and search live in the chat tab’s history popover. You can keep several chats open and switch between them like any other tabs.

Closing a tab stops that chat’s live process but keeps history on disk (unless it was an empty “new session” you never used). After a VS Code reload, tabs can restore; the visible tab reconnects first.

Multiple sessions in the launcher with status dots, each session its own editor tab

Welcome starters — start without a blank page

A new empty session shows a short value prop and starter cards, for example:

Starter What it does
Explain this project Fills a plain-English “overview this codebase” prompt you can edit and send
Write or fix something Seeds a helper prompt so you can describe the change
Plan a change safely Switches to Plan first and seeds a planning prompt
Create an image Starts with /imagine for image generation
Dictate instead of type Points you at the microphone (or notes setup if voice isn’t configured yet)

A Create a document row lives in the activity-bar launcher (under New session), with icons for Word, Excel, PowerPoint, PDF, CSV, and Markdown. Click one to open (or reuse an empty) session and fill the composer with Create <type>: — finish the sentence and send.

Power users can ignore the cards and type immediately.

Business Studio (3.0) — tasks, docs browser, templates

Thin-client Studio surfaces (not a separate Office app, not five permanent sidebar tabs):

  • Business tasks on the empty-session welcome screen (invoice, receipt, weekly report, pitch deck, approval workflow) — each seeds the composer for you to edit; nothing is sent until you press Send.
  • Docs (chat top bar) — browse a capped list of business documents already in the workspace; open, reveal in the OS, attach as context, or seed a path into the composer.
  • Templates (activity-bar left nav, under Create a document) — ~14 searchable business templates; click a row to seed a fill-ready prompt. The list fills the space down to Recent history. Real files still come from Grok CLI skills (/docx, /pptx, /xlsx, …) and ordinary file tools.

When a turn produces a document path, a document card still offers Copy path / Open / Reveal.

Business documents — Word, Excel, PowerPoint, PDF, CSV, Markdown

From the launcher's Create a document row, pick a document-type icon (or ask in plain language / use /docx, /pptx, /xlsx from autocomplete). When a tool result includes a document path, Grokbit shows a document card with Copy path, Open (editor for Markdown/CSV/text; system default app for Office/PDF), and Reveal in file explorer.

This is not a built-in Office suite: generation uses Grok’s skills and tools on your machine (some skills need local deps such as Node’s docx package). Attach an existing file as a chip to edit it.

Modes — Agent, Plan first & Auto accept
Mode In plain English
Agent (default) Grok can help right away. It may ask before editing files or running commands.
Plan first Grok drafts a plan first. Nothing changes in your project until you approve the plan.
Auto accept Grok acts without asking for permission on each change. Use when you trust the session.

Your last non-plan mode (Agent or Auto accept) is remembered for new sessions. Plan first is always a deliberate choice for the task at hand.

Plan mode — Grok drafts a plan and blocks workspace writes until you approve

Permission cards with inline diff — see every edit before you approve

When Grok proposes an edit, the diff is shown inside the chat card — green additions, red deletions, long unchanged stretches collapsed. Buttons use plain language:

  • Allow this change — approve once
  • Allow always — approve this kind of action for the rest of the session (when the CLI offers it)
  • Don't allow — reject

The file is written only after you approve. Past edits stay reviewable via view diff on the tool row. Diffs never open a separate editor tab (so focus stays on chat).

Questions from Grok

Sometimes Grok needs a choice from you (multiple options). An inline question card appears; pick an option (and Submit if there are several questions). After you answer, the card collapses to a green “✓ your choice” summary. On resume, past answers replay as read-only cards.

File context chips — point Grok at the right files
  • The active editor can be included automatically as context (setting: grok.includeActiveFileByDefault).
  • Drag files from the Explorer, right-click → Grokbit: Send File, press Alt+G, or use the + button to attach files.
  • Explicit attachments are stronger than the ambient “currently open” file.
  • Hold Shift while dragging to embed file contents as a fenced block instead of a path reference.
Session history — resume, rename, delete, clear all

The clock icon (and the launcher) lists this project’s sessions, newest first:

  • Click a row to resume (conversation, images, plans, and tools replay).
  • Hover to rename or delete.
  • Search filters by name across your whole history.
  • The list loads 100 at a time and loads more as you scroll (stays fast with thousands of sessions).
  • Clear all history removes every session for this project except ones that still have an open tab.

Session history — resume, rename, delete, search, or clear past sessions

Status dots — see which chats need you
Dot Meaning
🔵 Blue Working on it
🟡 Yellow Needs your OK (permission, question, or plan)
🟢 Green Finished — not opened yet
🔴 Red Finished with an error — not opened yet
⚪ Gray At rest / already seen

Unread green/red badges persist across reloads until you open that session.

Status-bar HUD + optional notifications

A native status bar item (bottom of VS Code) mirrors the active chat: model, thinking depth, mode, context %, working spinner, and a bell count when any session needs you. Click it to jump back to chat.

Optional setting grok.notifyWhenWaiting (off by default): a passive notification when a background tab needs you — it never steals focus; you choose Go to session.

Image & video generation — /imagine in chat

Type /imagine <description> (or /imagine-video <description>) and results render inline in the chat. Hover for Copy path / Open in VS Code. Subscription-only Grok features; they survive session resume. Editing a reference photo with /imagine is supported when the CLI offers it.

Voice control — speak instead of type

The microphone in the composer records speech via xAI Speech-to-Text. Words appear live as you talk. Say your send phrase (default “grok send”) to submit hands-free.

Needs: ffmpeg on PATH + a separate API key (grok.voiceApiKey or env). Cost: pay-as-you-go STT (~$0.10/hr batch, ~$0.20/hr streaming) — not covered by SuperGrok alone. Details: research/voice-input.md.

Tool activity — what Grok did, in plain language

While Grok works, each turn's activity rolls into one compact carousel strip instead of a scrolling list: the strip shows the current action (Reading chat.js…, Running command…) with a step counter, and ‹ › flips back through earlier steps. When the turn finishes it collapses to a one-line summary — e.g. Explored 5 items, edited 2 files · 9 steps — that expands to the full detail (tool rows, step narration, thinking). Commands can show output, failed tools turn red with a short reason, and a files changed strip above the composer summarizes applied edits this turn. Prefer the classic scrolling stream? Turn off grok.compactActivity (gear → Config & debug → Compact activity view).

Model & thinking depth

Pick the model and reasoning effort (none → xhigh) from the gear menu or the small model chip in the toolbar. Effort is how deeply Grok “thinks” (more depth = more tokens/time). Changing effort restarts the session (optional summarize-and-restart). Some model switches restart when the CLI requires a different agent type — the extension handles that.

Model and reasoning-effort controls in the gear popover

Show / hide thinking & chat size
  • grok.showThinking (default off) — when off, a short Thinking… stand-in is shown instead of full reasoning traces. Toggle live under gear → Config & debug → Show thinking details.
  • grok.chatFontScale — zoom only the Grok chat (60–300%), not the whole editor.
Math, diagrams & markdown
  • LaTeX math renders via MathJax (offline). Hover a display equation to copy or export PNG/SVG.
  • Mermaid diagrams render inline (offline, theme-aware). Hover to copy source or export.
  • Normal markdown (code, lists, tables) is fully supported.

Mermaid diagram rendered inline in the chat

Slash commands

Type / in the composer for autocomplete from your installed CLI (e.g. /imagine, /compact, …). Snapshot: docs/SLASH-COMMANDS.md.

Cost awareness

The context donut shows how full the conversation window is. Use /compact (gear → Compact) to compress history, or start a new session. Lower thinking depth for cheaper/faster turns.

MCP tools

Extra tools (browser automation, etc.) are configured in the CLI (~/.grok/config.toml or project .grok/config.toml). Gear → Connected tools (MCP) / open config files, then start a new session to reload.

Sign out

Gear → Log out, or command Grokbit: Log Out — runs grok logout, closes live session tabs, and shows the signed-out launcher. History stays on disk; sign in again to resume.

Telemetry (opt-out)

Anonymous usage only: one session_start per real conversation with install id + mode/model/effort — never message content, code, or paths. Off with grok.telemetry.enabled: false or VS Code’s global telemetry setting. See docs/privacy.md.


Configuration

All grok.* settings (VS Code Settings → search "Grokbit" or "grok")
Setting Default Notes
grok.cliPath "" Path to the grok binary. Empty = auto-discover.
grok.defaultModel "" Model ID for new sessions. Empty = CLI default.
grok.defaultEffort "" Thinking depth (none / minimal / low / medium / high / xhigh). Changing it restarts the session.
grok.defaultMode "" Mode for new sessions: Agent or Auto accept (Plan first is never remembered). Empty = Agent.
grok.includeActiveFileByDefault true Auto-add the active editor as a context chip.
grok.useCtrlEnterToSend false When true, Enter inserts a newline and Ctrl/Cmd+Enter sends.
grok.showThinking false Show full thinking details in chat.
grok.compactActivity true Roll each turn's activity into one carousel strip (off = classic scrolling stream).
grok.notifyWhenWaiting false Passive notification when a background tab needs you.
grok.telemetry.enabled true Anonymous usage telemetry (see Privacy).
grok.chatFontScale 100 Chat-only zoom percent (60–300).
grok.voiceApiKey "" xAI API key for voice STT (separate from CLI login).
grok.ffmpegPath "" Path to ffmpeg. Empty = PATH.
grok.voiceInputDevice "" Microphone override. Empty = system default.
grok.voiceSendPhrase "grok send" Spoken phrase to auto-submit. Empty = disable.
grok.voiceStreaming true Live streaming STT (false = cheaper batch).

Commands & keyboard shortcuts

VS Code commands & keys (Ctrl/Cmd+Shift+P → "Grokbit")
Command What it does
Grokbit: Open Open the Grokbit launcher / focus chat
Grokbit: New Session Start a fresh session tab
Grokbit: Compact Conversation Compress conversation context
Grokbit: Pick Model Open the model picker
Grokbit: Toggle Plan / Agent Mode Open the mode picker
Grokbit: Send File Attach the selected file as context
Grokbit: Send Selection Send the current text selection
Grokbit: Insert @-Mention Attach the active file from the editor
Grokbit: Show Logs Open troubleshooting logs
Grokbit: Log Out Sign out of the Grok CLI
Key Action
Ctrl+; / Cmd+; Open Grokbit
Alt+G Attach the current file (when the editor is focused)
Enter Send message (default)
Shift+Enter New line (default)
Ctrl/Cmd+Enter Send, if you enabled “Ctrl+Enter to send”

Also listed in-app: gear → Keyboard shortcuts.


How it works

The extension is intentionally thin: it talks to grok agent stdio and renders the results. Grok owns sessions, memory, tools, and models; Grokbit mediates file access, terminals, permissions, and the UI.

Plan first is the one place the extension adds a safety layer: it blocks workspace writes and non-read-only commands until you approve a plan, using clear follow-up messages Grok understands.

Full architecture notes: docs/architecture.md.


Development

Build, test & repo conventions
npm install
npm test         # grok-free unit/DOM/integration suite — same as CI
npm run package  # → grokbit-<version>.vsix

npm test never spawns the real grok binary. A separate npm run test:live exercises the real CLI before releases. See TESTS.md and docs/architecture.md.


Known limits

  • Diff preview compares proposed old vs new text (not necessarily disk at preview time); the write happens after you approve.
  • No worktree UI yet.
  • Subagent inspector is not shipped (the CLI does not expose nested subagent cards over ACP in current builds).
  • The launcher defaults to the left activity bar; move it to the secondary side bar manually if you want it on the right.

Privacy

Privacy by design — no message content, no code, no file paths, and no account identity leave your machine via telemetry. Turn telemetry off anytime with grok.telemetry.enabled: false or VS Code's global telemetry setting.

More: docs/privacy.md.


License & attribution

Licensed under the MIT License — see LICENSE. MIT is permissive (use, modify, sell, even in closed-source products) but not obligation-free: the copyright notice and license text must travel with all copies, including compiled builds. If you're reusing this project, see docs/attribution.md for what that means and how to credit it properly.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft