Clawd をもっと愛でたい ~statusLine 編~

Claude のかわいい公式マスコット「Clawd」にもっと活躍してほしかったので、statusLine で色々なギミックと共に表示してみました。
2026.09.29
 はじめにClawd をご存知でしょうか。Claude Code の起動時などに登場する、愛らしいカニ（？）のキャラクターです。
Opus 5.5 を紹介してくれています。かわいいですね。
それにしても前々から思っていたのですが、このキャラクター、登場頻度が低くないですか？

私の知る限り、Claude Code を起動した時くらいにしか出てきてくれません。
こんなにかわいいんだから、もっと活躍させたほうが Claude 愛も高まると思うのですが……

勿体ないことこの上ないです。
ということで、他の場所にも召喚してみましょう。
 statusLine で愛でてみたstatusLine とは、Claude Code の入力欄の下にある部分のことです。
デフォルトでは上記のような見た目ですが、自前のスクリプトを書くことで表示内容を自由自在に変えられます。ここに Clawd を呼べれば、Claude Code を使っている間はいつでも Clawd を愛でられそうです。
しかし、ただ statusLine にいてもらうだけというのも居づらいでしょうから、できれば実用面も担わせてあげたいところです。
さて、statusLine に表示する定番の項目としてコンテキスト使用率があります。今回は使用率が増えていくにつれて Clawd を太らせていこうと思います。
コンテキストとは、会話内で Claude が参照している情報量であり、Claude 内に蓄積された情報量とも言えます。つまり、コンテキストが増えていくにつれて Clawd が太っていくのはごく自然です。
では実装していきましょう。
 実装statusLine を自由にカスタマイズするためには、~/.claude/settings.json に実行するコマンドを書く必要があります。
{
  "statusLine": {
    "type": "command",
    "command": "node ~/.claude/statusline.js"
  }
}
スクリプトにはモデル名やコンテキスト使用率などのセッション情報が標準入力から JSON で渡され、標準出力に書いた内容がそのまま statusLine に表示されます。複数行の出力や ANSI エスケープによる色付けにも対応しているので、Clawd も問題なく住めそうです。
https://code.claude.com/docs/ja/statusline
まずは見た目です。公式ドット絵をなるべく再現したかったので、CLI 上の Claude Code ではどう描かれているかを確認してみました。
拡大してよく観察すると、どうやら ▟ や ▖ などの四分ブロック文字で描かれているようです。これが分かってしまえばあとは地道に再現するだけですね。
// ビットは左上 8、右上 4、左下 2、右下 1
const GLYPH = [' ', '▗', '▖', '▄', '▝', '▐', '▞', '▟', '▘', '▚', '▌', '▙', '▀', '▜', '▛', '█'];

for (let y = 0; y < grid.length; y += 2) {
  let line = '';
  for (let x = 0; x < grid[0].length; x += 2) {
    const bits = (grid[y][x] << 3) | (grid[y][x + 1] << 2) | (grid[y + 1][x] << 1) | grid[y + 1][x + 1];
    line += GLYPH[bits];
  }
  out.push(line);
}
 太らせるClawd の作画を崩さないための個人的なこだわりとして、ドット幅は 12 以上の偶数である必要があります。今回は簡単のため、5 段階で太らせるようにしました。
/** pct: コンテキスト使用率 */
const widthFor = (pct) => (pct < 20 ? 12 : pct < 40 ? 14 : pct < 60 ? 16 : pct < 80 ? 18 : 20);
おまけとして、太りすぎると色が変わるようにしてみます。
const NORMAL = [218, 119, 88];
const WARN = [214, 142, 61];
const DANGER = [198, 74, 58];

const colorFor = (pct) => (pct >= 90 ? DANGER : pct >= 70 ? WARN : NORMAL);




これはかわいい！長方形に近い体型をしているので、視覚的にも非常に分かりやすいですね。
 アニメーションアニメーションで更なるかわいさを追究しましょう。Claude の応答中にぴょんぴょん跳ねてくれれば頑張っている感が出そうです。
ただ、statusLine に渡される JSON には応答中かどうかを示す項目がありません。そこで hooks を使って UserPromptSubmit でフラグファイルを作成し、Stop で削除するようにしました。
INPUT=$(cat)
SESSION=$(echo "$INPUT" | jq -r '.session_id // empty' 2>/dev/null || true)
[ -n "$SESSION" ] || exit 0

FLAG="/tmp/clawd-busy-$SESSION"

case "${1:-}" in
  start) : > "$FLAG" ;;
  stop)  rm -f "$FLAG" ;;
esac
statusLine 側では、該当ファイルの有無でアニメーションを切り替えるよう実装します。なお、statusLine は普段メッセージの到着時などにしか更新されないため、refreshInterval を設定して定期的に描き直すようにしました。
頑張ってくれていますね。いつもありがとう。
 まとめということで、カスタマイズ次第でますます Clawd を愛でられることが分かりました。
本記事でご紹介した以外にも多種多様なアプローチがあるかと思いますので、ぜひ皆さんなりの Clawd との付き合い方を模索してみてください。
かわいい Clawd のシェアも何卒よろしくお願いします。