Claude Code Mods: Customize Behavior and UI with TypeScript
Claude Code can now be modded with a few lines of TypeScript. What Anthropic announced, how to install and write a mod, and the security checks to run first.
On October 1, 2026, Anthropic announced in a post from @ClaudeDevs that Claude Code can now be modded: with a few lines of TypeScript you can change how it behaves, customize the UI and swap in your own features — or have Claude write the mod for you. Mods ship inside plugins and install with /plugin in the CLI or desktop app. This post covers what Anthropic published, how to install and write a mod, and the security points to check first.
The official demo video
The announcement includes a roughly 71-second demo video: watch it on X.
What a mod is
Per the official docs, a mod is a plugin that changes how Claude Code looks and behaves, built from JavaScript or TypeScript event handlers. Claude Code calls a handler when an event happens — a tool call, a submitted prompt, part of the interface being drawn — and the handler can watch the event, rewrite it, or take it over.
Capabilities listed in the docs:
- Rewrite a prompt before it reaches the model
- Block, rewrite or retry tool calls
- Approve or deny permission requests
- Redact secrets from tool output
- Draw an interface you can use: a pane beside the transcript or a band above the prompt, with tabs, buttons and text fields
- Redraw parts Claude Code draws itself, such as a tool call's row, the spinner or the question dialog
- Add a
/commandthat runs your function without a Claude turn
Several mods can stack; they handle events in load order.
Built-in features are mods too
Anthropic's blog says the built-in /diff is now a mod you can turn off in /plugin or replace with your own, and that more built-in features will move to mods over time. The docs also list built-in mods such as cc-plugin-agents-md (loads AGENTS.md) and cc-plugin-telemetry.
Installing
Mods need Claude Code v2.1.287 or later, are on by default, and work in the CLI and the Code tab of the desktop app. Installation is the same as any plugin:
# inside a Claude Code session
/plugin install token-chart@your-org
# or from your shell
claude plugin install token-chart@your-org
If you install from the shell while a session is open, run /reload-plugins to load it. token-chart@your-org is the docs' example name, not a ready-made package.
Writing one
Two routes:
- Ask Claude: describe the feature in a Claude Code session; Claude writes the mod using its built-in
plugin-authoringskill. - Write it yourself: the smallest mod is three files —
.claude-plugin/plugin.json,hooks/hooks.jsonandhooks/register.js.
The official example counts tool calls and shows the count next to the spinner (Thinking · tool calls: 3…) with two hooks:
let calls = 0
export function register(on) {
on('tool.call', async ($, e, next) => {
calls += 1
$.ui.invalidate('ui.render')
return next(e)
})
on('ui.render', { component: 'Spinner' }, async ($, e, next) => {
return next({ ...e, props: { ...e.props, suffix: ' · tool calls: ' + calls + '…' } })
})
}
Security: read this before installing
The docs are explicit: a mod runs with the same access to your machine as Claude Code itself, and is not sandboxed. Once loaded, it can:
- Read and write files anywhere your account can, start programs and make network requests
- Read your secrets, including API keys in environment variables and settings files
- See every prompt you send and every tool call Claude makes
- Rewrite prompts and tool calls, and approve a tool call before you are asked
- Call a model on your plan or API key
Install mods only from authors and marketplaces you trust. Before installing, run claude plugin validate on the plugin's directory; the hooks: and calls: lines list the events it handles and what it asks Claude Code to do. To turn everything off, start with --safe-mode or set "disableAllHooks": true in ~/.claude/settings.json.
Team and Enterprise plans also get a built-in sec-default mod that loads first and stops user-installed mods from doing risky things such as overriding permission deny rules.
FAQ
What are Claude Code mods?
Plugins made of JavaScript or TypeScript event handlers that change how Claude Code behaves and looks: rewriting prompts, intercepting tool calls, adding panes and buttons.
How do I install a mod?
Run /plugin install name@marketplace in a session, or claude plugin install name@marketplace in your shell. You need Claude Code v2.1.287 or later.
Are mods safe?
Mods are not sandboxed and run with Claude Code's own permissions, so they can read secrets and approve tool calls. Install only from trusted sources and check what a mod does with claude plugin validate first.
Where do mods run?
The CLI and the Code tab of the desktop app run mod hooks and show what mods draw. The VS Code extension's chat panel and claude -p run the hooks but do not draw mod interfaces.
Further reading
Sources
TWD billing · Taiwan invoices · leading AI models · OpenAI-compatible API