PromptDeck
Claude Code docs
Library / Debug

Screenshot diagnosis

Diagnose a visual or UI bug straight from an image.

Debug Use images Common workflows images diagnosis ui Any Claude

Official basis Use images to give Claude context it can't get from text alone. docs ↗

The prompt 
[paste screenshot of the error or broken UI] What's causing this? Trace it to the responsible code and explain the mechanism before proposing a fix.

Why it works

A screenshot often carries more signal than a paraphrased description — layout, error text, and state all at once. Asking Claude to trace to code (not just guess) keeps it grounded.

Fill in

  • Drag or paste the screenshot of the error/broken state.

Follow-ups

  • “Now show the minimal fix and how to confirm it visually.”

More debug prompts

Describe the symptom Hand Claude a well-scoped bug it can act on immediately. Investigate with a subagent Explore a subsystem without bloating your main context. Pipe logs to Claude Triage a log file without leaving the terminal.
esc
API endpoint from pattern Add a route that matches your backend conventions, with tests. Reference patterns Build Build to a verifiable check Build against a concrete, runnable check. Verify your work Build Component clone Spin up a new component that matches an existing one. Reference patterns Build Feature from spec Implement one feature that fits the file's existing conventions. Give specific context Build Go above and beyond Get an ambitious first version instead of a bare minimum. Go above & beyond Build Mockup to code Recreate a design and self-check it visually. Use images Build Package a workflow as a Skill Turn a repeated workflow into a reusable Skill. Build Skills Build Plan-first scaffold Get an agreed plan before a single line is written. Plan first Build Scaffold with TDD Lock behavior with tests before writing the implementation. Verify your work Build Spec-first interview Turn a fuzzy feature idea into a written spec. Plan first Build Describe the symptom Hand Claude a well-scoped bug it can act on immediately. Give specific context Debug Investigate with a subagent Explore a subsystem without bloating your main context. Use subagents Debug Pipe logs to Claude Triage a log file without leaving the terminal. Headless & pipes Debug Print-debug plan Instrument a hard-to-see bug, then clean up after. Verify your work Debug Read before you claim Stop confident-but-wrong answers about unread code. Read before claiming Debug Regression bisect Pin a regression to the exact change that introduced it. Point to sources Debug Reproduce then fix Turn a bug into a permanent regression test. Verify your work Debug Root-cause first Understand a bug before touching any code. Fix root causes Debug Screenshot diagnosis Diagnose a visual or UI bug straight from an image. Use images Debug Stack-trace triage Get a fast, precise read on where a crash originates. Give specific context Debug Extract & dedupe Remove duplication without altering behavior. Verify your work Refactor Fan out a migration Plan a repetitive change across many files. Fan out Refactor Find deprecated usage first Map the blast radius before starting a migration. Plan first Refactor General solution, not test-gaming Prevent solutions that only satisfy the test cases. Solve the general case Refactor No over-engineering Keep a refactor tight and scoped to what was asked. Small, scoped changes Refactor Rename safely Rename a symbol everywhere without collateral edits. Small, scoped changes Refactor Simplify function Make a gnarly function readable without changing what it does. Small, scoped changes Refactor Split a large file Break up a sprawling file into focused modules. Plan first Refactor Type-tighten Firm up weak types and surface hidden bugs. Verify your work Refactor Understand git history first Learn the context behind code before you change it. Point to sources Refactor Diff review A focused correctness pass on the change you just made. Adversarial review Review Edge-case hunt Find the tests you forgot to write. Find edge cases Review Explain-back Understand unfamiliar code and catch surprises in it. Ask like a senior Review Fresh-context adversarial review An unbiased review that won't rubber-stamp your own code. Adversarial review Review Performance sniff Catch scaling problems before they hit production. Ask like a senior Review PR-ready check Self-review a PR the way a demanding reviewer would. Adversarial review Review Review against the plan Verify the change actually matches the agreed plan. Review vs plan Review Security pass A targeted security review of sensitive code. Adversarial review Review Structured review rubric Get a review you can parse by concern. Structure with XML Review Writer / Reviewer split Get reviewer eyes that aren't biased toward the author. Adversarial review Review
↑↓ navigate ↵ open esc close