Built "vscode-claude-status" to Monitor Claude Code Usage in the VS Code Status Bar

Have you ever experienced the frustration of realizing you've hit your usage limit while using Claude Code?

When you're deeply focused on your work in the editor, it's easy to forget to check your usage. Furthermore, it's a hassle to open a separate command or browser window just to look it up.

To solve this, I've created a VS Code extension called "vscode-claude-status" that displays your usage right in the VS Code status bar at all times.

https://github.com/long-910/vscode-claude-status

https://marketplace.visualstudio.com/items?itemName=long-kudo.vscode-claude-status

---

What it looks like

It displays this information continuously in the status bar at the bottom of VS Code:

Percentage Mode:

🤖 5h:45% 7d:62%

With this, you can see at a glance that you've consumed 45% of your 5-hour window and 62% of your weekly allowance.

Switching to Cost Mode:

🤖 5h:$14.21 7d:$53.17

You can also monitor how much you've spent in the current 5-hour window and for the week in real-time.

Clicking on the status bar opens a detailed dashboard.

---

Why I built it

Claude Code usage limits are managed by two metrics: a "5-hour rolling window" and a "weekly limit" (see this article for details).

The problem is that this usage information is not displayed anywhere consistently.

• You only realize you've "used too much" after hitting the limit.
• It's a hassle to run a terminal command just to check.
• You don't want to leave the editor while working in VS Code.

I previously built claude-tmux-status for tmux users, but this extension answers the demand to "check directly within VS Code." Since VS Code's status bar always shows information, the inspiration was simply to add Claude Code usage right there alongside it.

---

Features

Status Bar Display

Percent Mode (Default)

🤖 5h:45% 7d:62%

Part	Meaning
5h:45%	Consumption rate for the 5-hour window
7d:62%	Weekly consumption rate

A warning mark ! appears when usage exceeds 75%.

Cost Mode

🤖 5h:$14.21 7d:$53.17

Part	Meaning
5h:$14.21	Current cost for the 5-hour window
7d:$53.17	Total weekly cost

Since cost calculation is performed from local JSONL files, this mode does not call the API.

Status Indicator

Mark	State
(None)	Normal (under 75%)
!	Warning (75% or higher)
✗	Limit reached

---

Dashboard Panel

Clicking the status bar opens a detailed dashboard within VS Code.

You can check the following information on the dashboard:

• Usage Progress Bars — Visual consumption status for both the 5-hour window and the week.
• Token Cost Calculation — Detailed cost breakdown by input, output, and cache.
• Project-based Cost Tracking — How much you have spent on each project.
• Forecasts and Budget Alerts — Prediction of when the 5-hour window will be depleted based on burn rate ($/hour).
• Usage History Heatmap — View daily usage patterns at a glance.

---

Budget Management

Running "Claude Status: Set Budget" from the command palette (Ctrl+Shift+P) allows you to set a daily USD budget limit. You will receive a notification when the set threshold is reached, helping you prevent overspending.

---

Prerequisites

• Visual Studio Code 1.109 or higher
• Claude Code CLI (authenticated via claude login)

---

Installation

Method 1: From the VS Code Marketplace (Recommended)

Simply press Ctrl+Shift+X (or Cmd+Shift+X on Mac) in VS Code to open the extensions panel, search for "Claude Status," and install it.

Alternatively, you can install it directly using the following command:

code --install-extension long-kudo.vscode-claude-status

Method 2: From the Marketplace Page

Click the "Install" button on this page.

---

How to use

Switching Display Modes

Action	Function
Click the status bar	Open the dashboard
Ctrl+Shift+Alt+C	Toggle between Percent and Cost modes

You can also operate it by searching for commands starting with "Claude Status" in the command palette (Ctrl+Shift+P).

---

Mechanism and Caveats

Data Acquisition

This extension uses two types of data to display usage:

1. Local JSONL (Cost data)

It reads ~/.claude/projects/**/*.jsonl (the usage logs Claude Code records locally) to aggregate token counts and costs. No API calls are required, and it works offline.

2. Anthropic API (Rate limit data)

The 5-hour window consumption rate (percent display) is retrieved from the Anthropic API response headers. It calls the API at most once every 5 minutes.

Calling the API counts slightly against your usage

It sends a minimal request with max_tokens: 1, but this request itself counts toward your usage. The consumption is extremely small, but please be careful if you are near your limit. It uses the OAuth token saved in ~/.claude/.credentials.json for authentication.

Cost Calculation

Cost mode calculations are based on the Claude Sonnet 4.x pricing structure:

Token Type	Price (per 1M tokens)
Input Tokens	$3.00
Output Tokens	$15.00
Cache Read	$0.30
Cache Write	$3.75

---

Differences from claude-tmux-status

As another monitoring tool for Claude Code usage, there is claude-tmux-status for tmux users.

Feature	vscode-claude-status	claude-tmux-status
Display Location	VS Code Status Bar (Always)	tmux Status Bar (Always)
Dashboard	✅ (Click for details)	❌
Project-based Cost	✅	❌
Budget Management/Alerts	✅	❌
Usage History Heatmap	✅	❌
API calls while idle	Max once every 5 minutes	None (Smart cache)
Required Tool	VS Code	tmux

It is natural to use vscode-claude-status if you work mainly in VS Code, and claude-tmux-status if you work mainly in the terminal/tmux. If you use both VS Code and tmux, you can even install both for dual monitoring.

---

Recommended for

• Developers who use VS Code as their main editor: Constant visibility helps prevent overspending.
• Heavy Claude Code users: Reduces work interruptions caused by hitting limits.
• Those cost-conscious: Track daily spending with Cost Mode and budget settings.
• Those who rarely use the terminal: The workflow remains uninterrupted as everything is completed within VS Code.
• Those who want to track costs per project: Detailed breakdown available on the dashboard.

---

Summary

I introduced vscode-claude-status, which constantly displays Claude Code usage on the VS Code status bar.

• Install with one click from the VS Code Marketplace.
• Open the detailed dashboard just by clicking the status bar.
• Toggle between Percent mode and Cost mode with keyboard shortcuts.
• Packed with features like per-project cost tracking, budget alerts, and usage history heatmaps.

If you are a VS Code user who uses Claude Code daily, please give it a try.

I would appreciate a star if you find it helpful ⭐

https://github.com/long-910/vscode-claude-status

---

Reference Links

• How to manage Claude Code usage limits effectively — Detailed explanation of how usage limits work.
• claude-tmux-status — Usage monitoring tool for tmux users.
• VS Code Marketplace — Extension download page.