ClaudeMods
☰
JA
● 0 人がオンライン ・閲覧 0 回
スポンサー作品を投稿
GitHub リポジトリ · 投稿者 segfaultlab

clawd-hud

Claude Code デスクトップの Code ページ用ピクセル風使用量 HUD。コンテキスト、上限、費用、ピクセル Clawd の状態アニメーションを表示します。

翻訳済み

この mod について

clawd-hud は Claude Code デスクトップの mod で、Code ページの入力欄の上にピクセル風の使用量帯を表示し、Claude の状態に応じて動くピクセル Clawd を添えます。

機能:

  • コンテキスト、5 時間上限、週次上限のグリッド進捗バー
  • 5 時間上限の消費速度と、リセットまで持つかどうか
  • 現在のセッション費用、直近ターンの時間、出力 token、キャッシュヒット率
  • 思考、ツール呼び出し、ファイルの書き込み・読み取り・検索、承認待ち、コンテキスト圧縮、サブエージェント、バックグラウンドコマンド、返信、エラー、中断、アイドル、上限間近・到達などの状態に応じたピクセル Clawd

特徴:

  • 端末にすでにある Claude Code の使用量データだけを読み、追加の token を消費しません
  • デスクトップの Code ページだけに SVG で表示し、ターミナルには帯も上限通知も出しません

インストール:

claude plugin marketplace add segfaultlab/clawd-hud
claude plugin install clawd-hud@clawd-hud

導入後、デスクトップで新しいセッションを開けば有効になります。自動更新を有効にするか、marketplace/plugin update を手動で実行してください。

ローカル開発では claude --plugin-dir /path/to/clawd-hud、テストには claude plugin test .、README のプレビュー再生成には node scripts/preview.ts を使います。

インストール

まず作者の README で marketplace とプラグイン名を確認してください。コマンドはリポジトリの構成によって変わる場合があります。

claude plugin marketplace add segfaultlab/clawd-hud
claude plugin install clawd-hud
原文 / README

clawd-hud

Claude Code 桌面端的 mod:在 Code 页面的输入框上方显示一行像素风用量条,带一只会跟着状态做动作的像素 Clawd。

用量条

Clawd 的动作

  • 上下文、5 小时额度、本周额度的格子进度条
  • 5 小时额度的消耗速度,以及能不能撑到重置
  • 本会话花费、上一轮的耗时、输出 token 和缓存命中率
  • Clawd 跟着 Claude 的状态做动作:思考冒 ?、调用工具敲锤子、写文件拿笔写字、读文件和搜索捧书看(读完想下一步时也继续捧着)、等你批准时举手、压缩上下文揉纸团、子代理干活时脚边跟着小 Clawd、有后台命令时脚边亮着小终端、写回复飘字、出错晕倒、中断摔倒、空闲睡觉、额度快用完时冒汗发抖、用完躺平

只在本地读取 Claude Code 已有的用量数据,不额外消耗 token。

只在桌面端的 Code 页面显示,用 SVG 绘制。终端里的 Claude Code 不显示横条,也不弹额度提醒。

安装

claude plugin marketplace add segfaultlab/clawd-hud
claude plugin install clawd-hud@clawd-hud

装好后在桌面端新开一个会话就生效。

更新

建议打开自动更新:在终端里运行 claude,输入 /plugin,进入 Marketplaces,选中 clawd-hud,打开自动更新。之后有新版本时 Claude Code 会自己拉取,重启会话后生效。

不开自动更新的话,手动执行:

claude plugin marketplace update clawd-hud
claude plugin update clawd-hud@clawd-hud

5h 和 wk 两条来自订阅账号的额度数据,用 API key 登录时只显示 ctx。

本地开发

改代码时直接加载源码目录,不用安装:

claude --plugin-dir /path/to/clawd-hud

这时先在 /plugin 里停用已安装的 clawd-hud,否则会出现两条横条。终端里不显示横条,改完用 claude plugin test . 跑测试,用下面的脚本看效果图。

插件没有写版本号,每次提交到 GitHub 都算一个新版本。

改了画图代码后重新生成 README 里的图:

node scripts/preview.ts

文件

  • hooks/register.tsx:事件钩子,读取用量、跟踪状态
  • hooks/draw.ts:生成横条的 SVG(像素 Clawd、进度条、动画)
  • types/index.d.ts:mod 保存的状态类型
  • scripts/preview.ts:生成 docs/ 下的效果图
  • tests/band.test.tsx:桌面端能画出横条、终端不画的测试,用 claude plugin test . 运行

関連作品