ClaudeMods
☰
ZH-CN
● 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 . 运行测试,node scripts/preview.ts 重新生成 README 效果图。

安装

请先查看作者 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 . 运行

更多类似作品