Prompt Augment

AI-powered prompt enhancement for ChatGPT and Claude — like Grammarly, but for prompts.

What It Does

A Chrome extension that enriches your AI prompts with browsing context. Write a rough prompt, press a hotkey, and get back a structured, context-aware version with highlighted changes — right inside the chat interface.

Floating Action Button (FAB): A small button appears next to the prompt field on ChatGPT and Claude. Click it (or press Ctrl+Shift+E / Cmd+Shift+E on Mac) to enhance your prompt inline, with word-level diff highlights and an undo bar.

Toolbar popover: Click the extension icon to see capture status, event count, and a toggle to pause/resume context capture.

Setup

Prerequisites

• Node.js 20+
• Chrome browser

Install

git clone https://github.com/camptodata/prompt-augment.git
cd prompt-augment
npm install

Run

npm run dev

Load Extension

1. Open chrome://extensions/
2. Enable Developer Mode
3. Click "Load unpacked"
4. Select .output/chrome-mv3/

Usage

1. Browse, research, and copy text as usual — context is captured automatically
2. Open ChatGPT or Claude
3. Write your prompt
4. Click the floating wand button, or press Ctrl+Shift+E
5. The prompt is enhanced inline — word-level diff highlights appear for ~4 seconds, and an undo bar lets you revert

To pause/resume context capture, click the extension toolbar icon.

Architecture

entrypoints/
  background.ts        — Service worker: message routing, Cloudflare fetch, capture gate
  capture.content.ts   — Capture content script: tab visits, selections, clipboard
  fab.content/         — Floating action button: inline enhancement UI (primary surface)
  popup/               — Action popover: capture status + pause/resume toggle
  tokens.css           — Design tokens (colors, spacing, typography)
lib/
  types.ts             — Shared TypeScript types (Message union, etc.)
  prefs.ts             — Capture-enabled preference backed by chrome.storage.local
  session.ts           — Session event state, persisted to chrome.storage.session
  capture.ts           — Chrome tab event listeners
  trace.ts             — Pipeline trace logging (dev diagnostics)
  platforms/           — DOM adapters for ChatGPT and Claude
  fab/                 — FAB components: button, undo bar, field mirror, word diff
core/
  compressor.ts        — Compresses session events into text summary
  enhancer.ts          — Assembles prompt + context for the LLM
  scorer.ts            — Prompt quality scoring (structure, clarity, specificity)
  templates/           — System prompt template
backend/               — Cloudflare Worker (Hono) → Anthropic API (separate package.json)

Supported Platforms

• ChatGPT (chat.openai.com / chatgpt.com)
• Claude (claude.ai)

Commands

Command	Description
npm run dev	WXT dev server with HMR
npm run build	Production build to .output/chrome-mv3/
npx vitest	Run unit tests
npm run compile	TypeScript type check (no emit)
cd backend && npm run dev	Local backend dev server
cd backend && npm run deploy	Deploy backend to Cloudflare

Design

The extension uses a dark theme with CSS custom properties defined in tokens.css. All UI surfaces share a consistent design system: 3-layer background depth, 4-step text hierarchy, unified font stacks, and tokenized spacing/radii.

Accessibility follows WCAG 2.1 AA: all interactive elements have visible focus indicators, state changes are announced via ARIA live regions, semantic landmarks are used throughout, and color contrast meets minimum ratios.