Follow a step-by-step process to build a custom Chrome extension that summarizes links in Slack using Claude Code, from voice-dictated PRD to a fully debugged, accessible tool.
with Claire Vo
In VS Code, use a voice-to-text feature to dictate the core requirements for your link summarizer extension. Specify the trigger (keyboard shortcut Ctrl+Shift+1), action (find links, scrape content, summarize), and output (accessible modal with key takeaways).
We want to build a simple PRD for a locally run Chrome extension. Whose job is it to exist in Slack alone? And when focused on a Slack message, you can hit the keyboard shortcut, control shift one, and it will search that message to find any external links...In the Claude Code terminal, write a prompt that references your newly created PRD file. Leverage a pre-made Claude 'Skill' with Chrome extension boilerplate to accelerate development. Use Ctrl+G to open the prompt in a full editor for easier editing.
@PRD.md
Use the Claude Skill for creating chrome extensions to build out this PRD.
Use my open AI key from my shared chrome extension config.Claude will generate a complete plan for creating the files and code. Open this plan in the editor (Ctrl+G), use Markdown folding to quickly scan the high-level steps, and then approve the plan to let Claude begin writing the code.
Navigate to chrome://extensions, enable 'Developer mode', and click 'Load unpacked'. Select your project folder to install the local extension. Go to Slack, find a message with a link, and trigger your shortcut to perform the first test.
If the test fails (e.g., shows raw JSON), take a screenshot of the buggy output. Use a custom script or command (like the post's /pasteimage example) to send this image directly to Claude, asking it to identify and fix the problem.
Claude will analyze the screenshot and provide a code fix, such as adjusting the API call to request a specific JSON object response. After the agent applies the fix, reload the extension in Chrome and run the final test to confirm the summary now appears in a clean, accessible modal.
Supercharge your engineering velocity by using Claude Opus 4.6 to rapidly build features and then leveraging GPT-5.3 Codex to perform a rigorous, principal-level code review for production hardening.
Leverage Claude Opus 4.6 within Cursor to perform a complete, creative redesign of a marketing website, from initial high-level concepts to a polished, on-brand final product.
Build a privacy-focused Chrome extension with a keyboard shortcut (`Ctrl+Shift+S`) to instantly fix typos in any text field using a highly specific AI prompt, ensuring your meaning is never altered.
Join 100,000+ product managers who use ChatPRD to write better docs, align teams faster, and build products users love.