SLOPSHOPPER

orange-prompt

Paints the draft you are typing white on orange. Pair it with the Orange Dark theme to color your sent messages.

newprompt
v0.3.0MITupdated 2026-10-03philsimon/orange-prompt
A shopper browsing a rack in a slop shop
README

orange-prompt

A Claude Code mod that paints your draft white on an orange background (#C2410C) while you type. In a long session, the color separates your words from Claude's.

What It Includes

  • The orange-prompt plugin, which hooks prompt.edit and paints the draft.
  • The Orange Dark theme (theme/orange-dark.json), which colors every message you send.

The two pieces work together. The plugin colors the draft. The theme colors the sent message.

Install the Plugin

claude plugin marketplace add philsimon/orange-prompt
claude plugin install orange-prompt@orange-prompt

Then run /reload-plugins.

Install the Theme

mkdir -p ~/.claude/themes
cp theme/orange-dark.json ~/.claude/themes/

Restart Claude Code once, because the app reads the themes folder at launch. Then run /theme and select Orange Dark.

Limits

  • The prompt API paints text runs only. An empty input box and its border stay plain.
  • Slash-command rows such as /commit draw on the engine's own bar, which no plugin hook reaches. The theme colors that bar.

Develop

The .claude-plugin/types folder stays out of git. Copy it from another Claude Code mod, then run:

claude plugin validate .
claude plugin test .

License

MIT

Source 2 files
hooks/register.ts 10 lines
1import type { Register } from 'claude-code'
2
3import { paintDraft } from './decorate'
4
5export const register: Register = on => {
6  // The Orange Dark theme (~/.claude/themes/orange-dark.json) colors every sent message. This hook colors the draft while you type.
7  // The prompt API paints text runs only, so the empty box and its border stay as they are.
8  on('prompt.edit', async ($, e, next) => paintDraft(await next(e)))
9}
10
hooks/decorate.ts 11 lines
1export const ORANGE = '#C2410C'
2
3type Box = { text: string; cursor: number; decorations?: Array<Record<string, unknown>> }
4
5// Paints the whole draft white on orange. An empty draft gets no run, so the box stays plain until you type.
6export const paintDraft = <T extends Box>(box: T): T => {
7  if (box.text === '') return box
8  const run = { start: 0, end: box.text.length, backgroundColor: ORANGE, color: 'white' }
9  return { ...box, decorations: [...(box.decorations ?? []), run] }
10}
11