Design Jam icon

Design Jam

by adrien.gonin.101

v0.1.1 Updated Mar 1, 2026 107KiB
CWS
6
Users
★ 5.00
2 reviews
#135649
of 208.7K
developer
#11953 of 18.3K

Description

annotate the browser. prompt the AI. Design Jam lets you pin comments directly on page elements and export them as structured prompts for AI coding agents like Claude Code, Cursor, or Copilot. No account. No cloud. Everything runs locally in your browser. // how it works 1. Click any element on a page to drop a comment pin 2. Describe the change you want — type, dictate, or paste an image 3. Hit export — a structured markdown prompt lands in your clipboard 4. Paste it into your AI coding agent // annotate mode — free Pin comments on live page elements. Design Jam reads CSS properties, detects React and Vue components, and builds a prompt your AI actually understands. → Click-to-pin on any DOM element → Speech-to-text input → Image paste (Ctrl+V) → CSS inspector panel → Structured markdown export → React & Vue component detection // jam mode Capture any page section as an editable ASCII wireframe. Rearrange the layout with box-drawing tools. Export a text-based layout diff your agent can apply. → DOM-to-ASCII flattening → Box, line & text tools → Select, move, resize, duplicate → Freehand character painting → Layout diff on export → Element-to-selector mapping // why text Everything Design Jam produces is plain text. Comments become markdown. Layouts become ASCII. Prompts fit in a clipboard. Text is universal. Text is diffable. Text is what LLMs understand natively. No screenshots to misinterpret. No figma links to parse. Just structured intent, straight from the browser. // details — Works on any page: localhost, staging, production — Keyboard shortcut: Alt+Shift+D — Dark monochrome UI, stays out of your way — Shadow DOM isolation — won't break your page styles — All data stored locally in your browser (IndexedDB) — No tracking, no analytics, no external requests — Manifest V3 // who it's for Designers reviewing dev server output. Frontend devs annotating their own UI. Anyone feeding visual context to AI coding tools. If you've ever taken a screenshot, opened a chat, and typed "make the button bigger" — this replaces that entire workflow. Built by a designer who got tired of explaining CSS changes in plain english.
Design Jam screenshot 1Design Jam screenshot 2

Reviews

Loading reviews...

Permissions (3)

Permissions

activeTab Can access the current tab when you click the extension scripting Can inject scripts into web pages storage Can store data locally in your browser

Details

Version 0.1.1
Updated Mar 1, 2026
Size 107KiB
First Seen Mar 24, 2026