6 6
7> Copy-paste prompts for Claude Code, tagged by task and role.7> Copy-paste prompts for Claude Code, tagged by task and role.
8 8
9export const PromptLibrary = ({text = {}, labels = {}, tagLabels = {}, phaseLabels = {}, sourceLabels = {}, catLabels = {}}) => {
10 const RAW = useMemo(() => [{
11 id: 'get-oriented-in-a',
12 sdlc: 'discover',
13 cat: 'Onboard',
14 startN: 1,
15 roles: [],
16 prompt: 'give me an overview of this codebase: architecture, key directories, and how the pieces connect',
17 nextHref: '/en/memory',
18 src: 'workflows'
19 }, {
20 id: 'explain-unfamiliar-code',
21 sdlc: 'discover',
22 cat: 'Understand',
23 roles: [],
24 prompt: 'explain what {path} does and how data flows through it. write it up as {format}',
25 slots: {
26 path: 'src/scheduler/queue.ts',
27 format: 'an HTML page with a diagram, then open it in my browser'
28 },
29 nextHref: '/en/output-styles',
30 src: 'workflows'
31 }, {
32 id: 'find-where-something-happens',
33 sdlc: 'discover',
34 cat: 'Understand',
35 startN: 2,
36 roles: [],
37 prompt: 'where do we {behavior}?',
38 slots: {
39 behavior: 'validate uploaded file types'
40 },
41 src: 'workflows'
42 }, {
43 id: 'see-what-depends-on',
44 sdlc: 'discover',
45 cat: 'Understand',
46 roles: [],
47 prompt: 'what would break if I deleted {target}?',
48 slots: {
49 target: 'the retryWithBackoff helper'
50 },
51 src: 'workflows'
52 }, {
53 id: 'trace-how-code-evolved',
54 sdlc: 'discover',
55 cat: 'Understand',
56 roles: [],
57 prompt: 'look through the commit history of {path} and summarize how it evolved and why',
58 slots: {
59 path: 'internal/auth/session.go'
60 },
61 src: 'best-practices'
62 }, {
63 id: 'scope-a-change-before',
64 sdlc: 'discover',
65 cat: 'Understand',
66 roles: ['pm', 'design'],
67 prompt: 'which files would I need to touch to {change}?',
68 slots: {
69 change: 'add a dark mode toggle to settings'
70 },
71 src: 'teams'
72 }, {
73 id: 'ask-the-codebase-a',
74 sdlc: 'discover',
75 cat: 'Understand',
76 roles: ['pm'],
77 prompt: 'I am a {role}. walk me through what happens when a user {action}, from the UI down to the result',
78 slots: {
79 role: 'PM',
80 action: 'clicks Export to PDF'
81 },
82 nextHref: '/en/output-styles',
83 src: 'teams'
84 }, {
85 id: 'plan-a-multi-file',
86 sdlc: 'design',
87 cat: 'Plan',
88 roles: ['pm', 'design'],
89 prompt: 'plan how to refactor the {target} to {goal}. list the files you would change, but don\'t edit anything yet',
90 slots: {
91 target: 'payment module',
92 goal: 'support multiple currencies'
93 },
94 src: 'workflows'
95 }, {
96 id: 'draft-a-spec-by',
97 sdlc: 'design',
98 cat: 'Plan',
99 roles: ['pm'],
100 prompt: 'I want to build {feature}. interview me about implementation, UX, edge cases, and tradeoffs until we have covered everything, then write the spec to SPEC.md',
101 slots: {
102 feature: 'per-workspace rate limits'
103 },
104 nextHref: '/en/skills',
105 src: 'best-practices'
106 }, {
107 id: 'turn-a-meeting-into',
108 sdlc: 'design',
109 cat: 'Plan',
110 roles: ['pm'],
111 prompt: 'read {input} and write up the action items, then create a ticket in {tracker} for each one, with acceptance criteria',
112 slots: {
113 input: '@meeting-notes.md',
114 tracker: 'our issue tracker'
115 },
116 needs: 'tracker',
117 nextHref: '/en/skills',
118 src: 'teams'
119 }, {
120 id: 'map-edge-cases-before',
121 sdlc: 'design',
122 cat: 'Plan',
123 roles: ['design', 'pm'],
124 prompt: 'list the error states, empty states, and edge cases for {feature} that the design needs to cover',
125 slots: {
126 feature: 'the file upload flow'
127 },
128 src: 'teams'
129 }, {
130 id: 'turn-a-mockup-into',
131 sdlc: 'design',
132 cat: 'Prototype',
133 roles: ['design', 'pm', 'marketing'],
134 paste: 'mockup',
135 prompt: 'here is a mockup. build a working prototype I can click through, matching the layout and states shown',
136 src: 'teams'
137 }, {
138 id: 'implement-from-a-screenshot',
139 sdlc: 'design',
140 cat: 'Prototype',
141 roles: ['design'],
142 paste: 'design',
143 needs: 'browser',
144 prompt: 'implement this design, then take a screenshot of the result, compare it to the original, and fix any differences',
145 nextHref: '/en/goal',
146 src: 'best-practices'
147 }, {
148 id: 'follow-an-existing-pattern',
149 sdlc: 'build',
150 cat: 'Implement',
151 roles: [],
152 prompt: 'look at how {example} is implemented to understand the pattern, then build {new} the same way',
153 slots: {
154 example: 'the existing webhook handler',
155 new: 'a payments webhook handler'
156 },
157 nextHref: '/en/memory',
158 src: 'best-practices'
159 }, {
160 id: 'generate-docs-for-code',
161 sdlc: 'build',
162 cat: 'Implement',
163 roles: ['docs'],
164 prompt: 'find {scope} without {format} comments and add them, matching the style already used in the file',
165 slots: {
166 scope: 'the public functions in src/auth/',
167 format: 'JSDoc'
168 },
169 src: 'workflows'
170 }, {
171 id: 'add-a-small-well',
172 sdlc: 'build',
173 cat: 'Implement',
174 roles: [],
175 prompt: 'add a {endpoint} endpoint that returns {payload}',
176 slots: {
177 endpoint: '/health',
178 payload: 'the app version and uptime'
179 },
180 src: 'workflows'
181 }, {
182 id: 'build-a-small-internal',
183 sdlc: 'build',
184 cat: 'Implement',
185 roles: ['pm', 'design', 'marketing', 'docs'],
186 prompt: 'create a {tool} using HTML, CSS, and vanilla JavaScript, then open it in my browser',
187 slots: {
188 tool: 'drag-and-drop Kanban board with three columns'
189 },
190 src: 'teams'
191 }, {
192 id: 'work-an-issue-end',
193 sdlc: 'build',
194 cat: 'Implement',
195 roles: [],
196 prompt: 'read issue #{issue}, implement the fix, and run the tests',
197 slots: {
198 issue: '312'
199 },
200 needs: 'gh',
201 src: 'workflows'
202 }, {
203 id: 'find-and-update-copy',
204 sdlc: 'build',
205 cat: 'Implement',
206 roles: ['design', 'docs', 'marketing'],
207 prompt: 'find every place we say "{copy}" or a close variant, show me each one in context, then update them all to "{new}". leave tests and the changelog alone',
208 slots: {
209 copy: 'Sign up free',
210 new: 'Start free trial'
211 },
212 src: 'teams'
213 }, {
214 id: 'draft-from-past-examples',
215 sdlc: 'build',
216 cat: 'Implement',
217 roles: ['docs', 'marketing', 'pm'],
218 prompt: 'read the {examples} in {folder} to learn the structure and voice, then draft a new one for {topic}',
219 slots: {
220 examples: 'privacy impact assessments',
221 folder: 'legal/pia/',
222 topic: 'the new analytics integration'
223 },
224 nextHref: '/en/skills',
225 src: 'legal'
226 }, {
227 id: 'write-tests-run-them',
228 sdlc: 'build',
229 cat: 'Test',
230 startN: 4,
231 roles: [],
232 prompt: 'write tests for {path}, run them, and fix any failures',
233 slots: {
234 path: 'app/parsers/feed.py'
235 },
236 nextHref: '/en/memory',
237 src: 'workflows'
238 }, {
239 id: 'drive-implementation-from-tests',
240 sdlc: 'build',
241 cat: 'Test',
242 roles: [],
243 prompt: 'write tests for {feature} first, then implement it until they pass',
244 slots: {
245 feature: 'the password reset flow'
246 },
247 src: 'ebook'
248 }, {
249 id: 'fill-gaps-from-a',
250 sdlc: 'build',
251 cat: 'Test',
252 roles: [],
253 prompt: 'read {report} and add tests for the lowest-covered files until each is above {target}%',
254 slots: {
255 report: 'coverage/coverage-summary.json',
256 target: '80'
257 },
258 nextHref: '/en/goal',
259 src: 'workflows'
260 }, {
261 id: 'migrate-a-pattern-across',
262 sdlc: 'build',
263 cat: 'Refactor',
264 roles: [],
265 prompt: 'migrate everything from {from} to {to}: identify every place that needs to change, then make the changes',
266 slots: {
267 from: 'the old logging API',
268 to: 'the structured logger'
269 },
270 src: 'workflows'
271 }, {
272 id: 'port-code-between-languages',
273 sdlc: 'build',
274 cat: 'Refactor',
275 roles: [],
276 prompt: 'port {source} to {target}, keeping the same {keep}',
277 slots: {
278 source: 'this Python module',
279 target: 'Rust',
280 keep: 'public API and test behavior'
281 },
282 src: 'teams'
283 }, {
284 id: 'optimize-against-a-measurable',
285 sdlc: 'build',
286 cat: 'Refactor',
287 roles: ['data'],
288 prompt: 'optimize {target} to bring {metric} from {current} down to under {goal}',
289 slots: {
290 target: 'the search query',
291 metric: 'p95 latency',
292 current: '2s',
293 goal: '500ms'
294 },
295 nextHref: '/en/goal',
296 src: 'ebook'
297 }, {
298 id: 'fix-a-precise-visual',
299 sdlc: 'build',
300 cat: 'Refactor',
301 roles: ['design'],
302 prompt: 'the {element} extends {amount} beyond the {container} on {viewport}. fix it.',
303 slots: {
304 element: 'login button',
305 amount: '20px',
306 container: 'card border',
307 viewport: 'mobile'
308 },
309 nextHref: '/en/desktop#preview-your-app',
310 src: 'ebook'
311 }, {
312 id: 'review-your-changes-before',
313 sdlc: 'build',
314 cat: 'Review',
315 startN: 5,
316 roles: [],
317 prompt: 'review my uncommitted changes and flag anything that looks risky before I commit',
318 nextHref: '/en/commands',
319 src: 'workflows'
320 }, {
321 id: 'review-a-pull-request',
322 sdlc: 'build',
323 cat: 'Review',
324 roles: [],
325 prompt: 'review PR #{pr} and summarize what changed, then list any concerns',
326 slots: {
327 pr: '247'
328 },
329 needs: 'gh',
330 nextHref: '/en/code-review',
331 src: 'workflows'
332 }, {
333 id: 'review-infrastructure-changes-before',
334 sdlc: 'build',
335 cat: 'Review',
336 roles: ['security', 'ops'],
337 paste: 'plan',
338 prompt: 'here is my Terraform plan output. what is this going to do, and is anything here going to cause problems?',
339 src: 'teams'
340 }, {
341 id: 'run-a-security-review',
342 sdlc: 'build',
343 cat: 'Review',
344 roles: ['security'],
345 prompt: 'use a subagent to review {path} for security issues and report what it finds',
346 slots: {
347 path: 'src/api/'
348 },
349 nextHref: '/en/sub-agents',
350 src: 'best-practices'
351 }, {
352 id: 'review-content-before-sending',
353 sdlc: 'build',
354 cat: 'Review',
355 roles: ['marketing', 'docs'],
356 prompt: 'review {file} for {concerns} and list anything I should fix before it goes to {reviewer}',
357 slots: {
358 file: 'launch-post.md',
359 concerns: 'unsupported claims, missing attributions, and brand-guideline issues',
360 reviewer: 'legal'
361 },
362 nextHref: '/en/skills',
363 src: 'legal'
364 }, {
365 id: 'course-correct-a-wrong',
366 sdlc: 'build',
367 cat: 'Steer',
368 roles: [],
369 prompt: 'that is not right: {feedback}. try a different approach',
370 slots: {
371 feedback: 'the function signature needs to stay backward-compatible'
372 },
373 nextHref: '/en/checkpointing',
374 src: 'best-practices'
375 }, {
376 id: 'narrow-the-scope-of',
377 sdlc: 'build',
378 cat: 'Steer',
379 roles: [],
380 prompt: 'that is too much. keep only the changes to {scope} and undo your other edits',
381 slots: {
382 scope: 'the validation logic in src/forms/'
383 },
384 src: 'best-practices'
385 }, {
386 id: 'turn-a-correction-into',
387 sdlc: 'build',
388 cat: 'Steer',
389 roles: [],
390 prompt: 'you keep {mistake}. add a rule to CLAUDE.md so this stops happening',
391 slots: {
392 mistake: 'using default exports when this project uses named exports'
393 },
394 nextHref: '/en/memory',
395 src: 'best-practices'
396 }, {
397 id: 'resolve-merge-conflicts',
398 sdlc: 'ship',
399 cat: 'Git',
400 roles: [],
401 prompt: 'resolve the merge conflicts in this branch and explain what you kept from each side',
402 src: 'workflows'
403 }, {
404 id: 'commit-with-a-generated',
405 sdlc: 'ship',
406 cat: 'Git',
407 roles: [],
408 prompt: 'commit these changes with a message that summarizes what I did',
409 src: 'workflows'
410 }, {
411 id: 'open-a-pull-request',
412 sdlc: 'ship',
413 cat: 'Git',
414 roles: [],
415 prompt: 'find the ticket about {topic} in {tracker} and open a PR that implements it',
416 slots: {
417 tracker: 'our issue tracker',
418 topic: 'the login timeout'
419 },
420 needs: 'tracker',
421 src: 'workflows'
422 }, {
423 id: 'draft-release-notes-from',
424 sdlc: 'ship',
425 cat: 'Release',
426 roles: ['pm', 'docs', 'marketing'],
427 prompt: 'compare {from} to {to} and draft release notes grouped by feature, fix, and breaking change',
428 slots: {
429 from: 'v2.3.0',
430 to: 'v2.4.0'
431 },
432 nextHref: '/en/skills',
433 src: 'workflows'
434 }, {
435 id: 'write-a-ci-workflow',
436 sdlc: 'ship',
437 cat: 'Release',
438 roles: ['ops'],
439 prompt: 'write a GitHub Actions workflow that {steps} on every push to {branch}',
440 slots: {
441 steps: 'runs the tests and deploys to staging',
442 branch: 'main'
443 },
444 src: 'workflows'
445 }, {
446 id: 'find-and-fix-a',
447 sdlc: 'operate',
448 cat: 'Debug',
449 startN: 3,
450 roles: [],
451 prompt: 'the {test} test is failing, find out why and fix it',
452 slots: {
453 test: 'UserAuth'
454 },
455 src: 'workflows'
456 }, {
457 id: 'investigate-a-reported-error',
458 sdlc: 'operate',
459 cat: 'Debug',
460 roles: ['ops'],
461 prompt: 'users are seeing {symptom} on {where}. investigate and tell me what is going on',
462 slots: {
463 symptom: '500 errors',
464 where: '/api/settings'
465 },
466 nextHref: '/en/web-quickstart#pre-fill-sessions',
467 src: 'workflows'
468 }, {
469 id: 'fix-a-build-error',
470 sdlc: 'operate',
471 cat: 'Debug',
472 roles: ['ops'],
473 paste: 'error',
474 prompt: 'here is a build error. fix the root cause and verify the build succeeds',
475 src: 'best-practices'
476 }, {
477 id: 'investigate-a-production-incident',
478 sdlc: 'operate',
479 cat: 'Incident',
480 roles: ['ops', 'security'],
481 prompt: '{symptom}. check the logs, recent deploys, and config changes, then tell me the most likely cause',
482 slots: {
483 symptom: 'the checkout endpoint started returning 500s an hour ago'
484 },
485 nextHref: '/en/mcp',
486 src: 'workflows'
487 }, {
488 id: 'diagnose-from-a-console',
489 sdlc: 'operate',
490 cat: 'Incident',
491 roles: ['ops', 'data'],
492 paste: 'screenshot',
493 prompt: 'here is a screenshot of {console}. walk me through why {resource} is failing and give me the exact commands to fix it',
494 slots: {
495 console: 'our Kubernetes dashboard',
496 resource: 'this pod'
497 },
498 src: 'teams'
499 }, {
500 id: 'query-logs-in-plain',
501 sdlc: 'operate',
502 cat: 'Incident',
503 roles: ['security', 'ops', 'data'],
504 prompt: 'show me all {events} for {scope} over {timeframe}. write the query, run it, and tell me what stands out',
505 slots: {
506 events: 'failed logins',
507 scope: 'the auth service',
508 timeframe: 'the past 24 hours'
509 },
510 needs: 'db',
511 src: 'cybersecurity'
512 }, {
513 id: 'analyze-a-data-file',
514 sdlc: 'operate',
515 cat: 'Data',
516 roles: ['data', 'pm', 'marketing'],
517 paste: 'csv',
518 prompt: 'read {file}, summarize the key patterns, and write the results to {output}',
519 slots: {
520 file: '@reports/q1-signups.csv',
521 output: 'an HTML page with charts, then open it in my browser'
522 },
523 nextHref: '/en/mcp',
524 src: 'teams'
525 }, {
526 id: 'generate-variations-from-performance',
527 sdlc: 'operate',
528 cat: 'Data',
529 roles: ['marketing', 'data'],
530 paste: 'csv',
531 prompt: 'read {file}, find the underperforming {items}, and generate {n} new variations that stay under {limit} characters',
532 slots: {
533 file: '@ads-performance.csv',
534 items: 'headlines',
535 n: '20',
536 limit: '90'
537 },
538 nextHref: '/en/mcp',
539 src: 'teams'
540 }, {
541 id: 'turn-a-recurring-task',
542 sdlc: 'operate',
543 cat: 'Automate',
544 roles: [],
545 prompt: 'create a /{name} skill for this project that {steps}',
546 slots: {
547 name: 'ship',
548 steps: 'runs the linter and tests, then drafts a commit message'
549 },
550 src: 'workflows'
551 }, {
552 id: 'add-a-hook-for',
553 sdlc: 'operate',
554 cat: 'Automate',
555 roles: [],
556 prompt: 'write a hook that {action} after every {event}',
557 slots: {
558 action: 'runs prettier',
559 event: 'edit to a .ts or .tsx file'
560 },
561 src: 'best-practices'
562 }, {
563 id: 'connect-a-tool-with',
564 sdlc: 'operate',
565 cat: 'Automate',
566 roles: [],
567 prompt: 'connect {server} via MCP so you can read its {data} directly',
568 slots: {
569 server: 'our error tracker',
570 data: 'stack traces'
571 },
572 src: 'workflows'
573 }, {
574 id: 'capture-what-to-remember',
575 sdlc: 'operate',
576 cat: 'Automate',
577 roles: ['pm', 'docs'],
578 prompt: 'summarize what we did this session and suggest what to add to CLAUDE.md',
579 src: 'teams'
580 }], []);
581 const PROMPTS = useMemo(() => {
582 if (typeof window !== 'undefined') {
583 const rawIds = new Set(RAW.map(p => p.id));
584 RAW.forEach(p => {
585 if (!text[p.id]) console.warn('[prompt-library] no text[] entry for id:', p.id);
586 });
587 Object.keys(text).forEach(k => {
588 if (!rawIds.has(k)) console.warn('[prompt-library] orphaned text[] key:', k);
589 });
590 }
591 return RAW.map(p => ({
592 ...p,
593 title: p.id,
594 teaches: '',
595 ...text[p.id] || ({})
596 }));
597 }, [RAW, text]);
598 const L = labels;
599 const TL = k => tagLabels[k] || k;
600 const CAT_TAG = useMemo(() => ({
601 Onboard: 'understand',
602 Understand: 'understand',
603 Plan: 'plan',
604 Prototype: 'prototype',
605 Implement: 'build',
606 Test: 'test',
607 Refactor: 'refactor',
608 Review: 'review',
609 Steer: 'steer',
610 Git: 'git',
611 Release: 'release',
612 Debug: 'debug',
613 Incident: 'debug',
614 Data: 'data',
615 Automate: 'automate'
616 }), []);
617 const TAGS = useMemo(() => ['understand', 'plan', 'prototype', 'build', 'test', 'refactor', 'review', 'steer', 'debug', 'git', 'release', 'data', 'automate', 'pm', 'design', 'docs', 'marketing', 'security', 'ops'], []);
618 const tagsOf = p => [CAT_TAG[p.cat], ...p.roles || []];
619 const doc = useMemo(() => {
620 const p = typeof window !== 'undefined' ? window.location.pathname : '';
621 const base = p.startsWith('/docs/') ? '/docs' : '';
622 const m = p.slice(base.length).match(/^\/([a-z]{2}(?:-[A-Z]{2})?)\//);
623 const locale = m ? m[1] : 'en';
624 return href => {
625 if (!href) return undefined;
626 if (href[0] === '#' || href.startsWith('https://')) return href;
627 if (!(/^\/[A-Za-z0-9]/).test(href)) return undefined;
628 return base + (href.startsWith('/en/') ? '/' + locale + href.slice(3) : href);
629 };
630 }, []);
631 const SAFE_HREF = /^(\/(?![\/\\\s])|#|https?:\/\/)/;
632 const linkify = s => {
633 const out = [];
634 let last = 0;
635 const re = /\[([^\]]+)\]\(([^)]+)\)/g;
636 for (let m; m = re.exec(s); ) {
637 if (m.index > last) out.push(s.slice(last, m.index));
638 out.push(SAFE_HREF.test(m[2]) ? <a key={m.index} href={doc(m[2])}>{m[1]}</a> : m[1]);
639 last = re.lastIndex;
640 }
641 if (last < s.length) out.push(s.slice(last));
642 return out;
643 };
644 const codeify = s => s.split(/(`[^`]+`)/g).map((part, i) => part[0] === '`' ? <code key={i}>{part.slice(1, -1)}</code> : part);
645 const SOURCES = useMemo(() => ({
646 'workflows': '/en/common-workflows',
647 'teams': 'https://claude.com/blog/how-anthropic-teams-use-claude-code',
648 'legal': 'https://claude.com/blog/how-anthropic-uses-claude-legal',
649 'cybersecurity': 'https://claude.com/blog/how-anthropic-uses-claude-cybersecurity',
650 'best-practices': '/en/best-practices',
651 'ebook': 'https://resources.anthropic.com/hubfs/Scaling%20agentic%20coding%20across%20your%20organization.pdf'
652 }), []);
653 const [mounted, setMounted] = useState(false);
654 const [q, setQ] = useState('');
655 const [start, setStart] = useState(true);
656 const [sel, setSel] = useState(null);
657 const [openId, setOpenId] = useState(null);
658 const [copied, setCopied] = useState(null);
659 const [fills, setFills] = useState({});
660 const copyTimer = useRef(null);
661 useEffect(() => {
662 setMounted(true);
663 return () => clearTimeout(copyTimer.current);
664 }, []);
665 const setFill = (id, key, val) => setFills(f => ({
666 ...f,
667 [id + '.' + key]: val
668 }));
669 const fillOf = (p, key) => {
670 const v = fills[p.id + '.' + key];
671 return v !== undefined ? v : p.slots && p.slots[key] !== undefined ? p.slots[key] : '';
672 };
673 const assemble = p => p.prompt.replace(/\{(\w+)\}/g, (_, k) => fillOf(p, k) || p.slots && p.slots[k] || k);
674 const preview = p => p.prompt.replace(/\{(\w+)\}/g, (_, k) => p.slots && p.slots[k] || k);
675 const bodyText = p => preview(p) + ' ' + p.teaches.replace(/\[([^\]]+)\]\([^)]+\)/g, '$1') + ' ' + (p.next || '');
676 const WIDE_RE = /[\u1100-\u115F\u2E80-\uA4CF\uAC00-\uD7A3\uF900-\uFAFF\uFE30-\uFE4F\uFF00-\uFF60\uFFE0-\uFFE6]/g;
677 const widthFor = s => {
678 const t = typeof s === 'string' ? s : '';
679 return t.length + (t.match(WIDE_RE) || []).length + 3 + 'ch';
680 };
681 const ql = q.trim().toLowerCase();
682 const toggleTag = k => {
683 setStart(false);
684 setSel(s => !ql && s === k ? null : k);
685 };
686 const clear = () => {
687 setStart(false);
688 setSel(null);
689 setQ('');
690 };
691 const results = useMemo(() => {
692 const list = PROMPTS.filter(p => {
693 if (ql) return p.title.toLowerCase().includes(ql) || bodyText(p).toLowerCase().includes(ql);
694 if (start) return !!p.startN;
695 if (sel) return tagsOf(p).includes(sel);
696 return true;
697 });
698 if (ql) return list;
699 if (start) return list.sort((a, b) => a.startN - b.startN);
700 if (sel) return list.sort((a, b) => (a.roles || []).length - (b.roles || []).length || (b.sdlc === 'operate') - (a.sdlc === 'operate'));
701 return list;
702 }, [PROMPTS, ql, start, sel]);
703 const matchSnippet = p => {
704 if (!ql || p.title.toLowerCase().includes(ql)) return null;
705 const txt = bodyText(p);
706 const at = txt.toLowerCase().indexOf(ql);
707 if (at < 0) return null;
708 const lo = Math.max(0, at - 30), hi = Math.min(txt.length, at + ql.length + 50);
709 return [lo > 0 ? '…' : '', txt.slice(lo, at), <mark key="m">{txt.slice(at, at + ql.length)}</mark>, txt.slice(at + ql.length, hi), hi < txt.length ? '…' : ''];
710 };
711 const grouped = useMemo(() => {
712 if (start && !q.trim()) return [];
713 const g = {};
714 for (const p of results) {
715 const key = p.sdlc + '|' + p.cat;
716 (g[key] = g[key] || ({
717 sdlc: p.sdlc,
718 cat: p.cat,
719 items: []
720 })).items.push(p);
721 }
722 return Object.values(g);
723 }, [results, start, q]);
724 const copy = async (str, id) => {
725 try {
726 await navigator.clipboard.writeText(str);
727 } catch {
728 const ta = document.createElement('textarea');
729 ta.value = str;
730 ta.setAttribute('readonly', '');
731 ta.style.position = 'fixed';
732 ta.style.opacity = '0';
733 document.body.appendChild(ta);
734 ta.select();
735 document.execCommand('copy');
736 document.body.removeChild(ta);
737 }
738 clearTimeout(copyTimer.current);
739 setCopied(id);
740 copyTimer.current = setTimeout(() => setCopied(null), 1600);
741 };
742 const promptBody = p => {
743 if (!p.slots) return <code>{p.prompt}</code>;
744 const parts = p.prompt.split(/(\{\w+\})/g);
745 return <code>
746 {parts.map((part, idx) => {
747 const m = part.match(/^\{(\w+)\}$/);
748 if (!m) return <span key={idx}>{part}</span>;
749 const k = m[1];
750 const val = fillOf(p, k);
751 return <input key={idx} type="text" className="pl-slot" value={val} placeholder={p.slots[k] || k} aria-label={k} style={{
752 width: widthFor(val || p.slots[k])
753 }} onChange={e => setFill(p.id, k, e.target.value)} onFocus={e => e.target.select()} onClick={e => e.stopPropagation()} />;
754 })}
755 </code>;
756 };
757 const card = p => {
758 const open = openId === p.id;
759 const srcHref = SOURCES[p.src];
760 const srcLabel = sourceLabels[p.src];
761 const snip = matchSnippet(p);
762 return <div key={p.id} className={'pl-card' + (open ? ' pl-open' : '')}>
763 <button type="button" className="pl-head" onClick={() => setOpenId(open ? null : p.id)} aria-expanded={open}>
764 <span className="pl-title">{p.title}</span>
765 {!!p.startN && <span className="pl-chip">{L.startHere} · {p.startN}</span>}
766 </button>
767 {snip ? <div className="pl-match">{snip}</div> : <code className="pl-prompt-preview">{preview(p)}</code>}
768 {open && <div className="pl-body">
769 <div className="pl-label">{p.slots ? L.fillAndCopy : L.copyThis}</div>
770 {p.needs && L.needs && L.needs[p.needs] && <div className="pl-hint pl-needs">
771 <span className="pl-needs-label">{L.needsLabel}</span> {linkify(L.needs[p.needs])}
772 </div>}
773 {p.paste && L.paste && L.paste[p.paste] && <div className="pl-hint pl-paste">{L.paste[p.paste]}</div>}
774 {p.slots && <div className="pl-hint">
775 {L.hintBefore} <span className="pl-hint-chip">{L.hintChip}</span> {L.hintAfter}
776 </div>}
777 <div className="pl-prompt-box">
778 <span className="pl-caret">{'❯'}</span>
779 {promptBody(p)}
780 <button type="button" className="pl-copy" onClick={() => copy(assemble(p), p.id)}>
781 {copied === p.id ? L.copied : L.copy}
782 </button>
783 </div>
784 <div className="pl-label">{L.whyWorks}</div>
785 <div className="pl-teaches">{linkify(p.teaches)}</div>
786 {p.nextHref && p.next && SAFE_HREF.test(p.nextHref) && <div className="pl-next">
787 <span className="pl-next-label">{L.makeItStick}</span>
788 <a href={doc(p.nextHref)}>{codeify(p.next)} →</a>
789 </div>}
790 {srcLabel && <div className="pl-src">{L.from} {srcHref ? <a href={doc(srcHref)}>{srcLabel}</a> : srcLabel}</div>}
791 </div>}
792 </div>;
793 };
794 const STYLES = useMemo(() => `
795.pl {
796 --pl-accent: #D97757;
797 --pl-accent-bg: rgba(217,119,87,0.07);
798 --pl-bg: #fff;
799 --pl-surface: #FAFAF7;
800 --pl-border: #E8E6DC;
801 --pl-border-subtle: rgba(31,30,29,0.08);
802 --pl-text: #141413;
803 --pl-text-2: #5E5D59;
804 --pl-text-3: #73726C;
805 --pl-text-4: #9C9A92;
806 --pl-mono: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
807 font-family: 'Anthropic Sans', -apple-system, BlinkMacSystemFont, sans-serif;
808 font-size: 16px; color: var(--pl-text); margin: 8px 0 32px;
809}
810.dark .pl {
811 --pl-bg: #1f1e1d;
812 --pl-surface: #262624;
813 --pl-border: #3d3d3a;
814 --pl-border-subtle: rgba(240,238,230,0.08);
815 --pl-text: #f0eee6;
816 --pl-text-2: #bfbdb4;
817 --pl-text-3: #91908a;
818 --pl-text-4: #73726c;
819}
820.pl *, .pl *::before, .pl *::after { box-sizing: border-box; }
821.pl button { font-family: inherit; cursor: pointer; }
822.pl a { color: var(--pl-accent); text-decoration: none; }
823.pl a:hover { text-decoration: underline; }
824
825.pl-search {
826 display: flex; align-items: center; gap: 10px;
827 padding: 14px 18px; background: var(--pl-surface);
828 border: 1px solid var(--pl-border); border-radius: 12px;
829 margin-bottom: 14px;
830}
831.pl-search input {
832 flex: 1; border: none; outline: none; background: transparent;
833 font-size: 16px; color: var(--pl-text);
834}
835.pl-search input::placeholder { color: var(--pl-text-4); }
836
837.pl-tags { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
838.pl-tag {
839 padding: 7px 14px; border: 1px solid var(--pl-border); background: var(--pl-bg);
840 font-size: 14px; color: var(--pl-text-2); border-radius: 999px;
841}
842.pl-tag:hover { background: var(--pl-surface); }
843.pl-tag.pl-on { background: var(--pl-text); border-color: var(--pl-text); color: var(--pl-bg); }
844.pl-tag.pl-start { color: var(--pl-accent); font-weight: 500; }
845.pl-tag.pl-start.pl-on { background: var(--pl-accent); border-color: var(--pl-accent); color: #fff; }
846.pl-tags.pl-dim .pl-tag { opacity: 0.5; }
847.pl-tags.pl-dim .pl-tag:hover { opacity: 1; }
848.pl-sep { width: 1px; height: 22px; background: var(--pl-border); margin: 0 4px; }
849.pl-clear { border: none; background: none; font-size: 13px; color: var(--pl-text-4); padding: 4px 6px; }
850.pl-clear:hover { color: var(--pl-text-2); }
851.pl-count { margin-left: auto; font-size: 14px; color: var(--pl-text-4); }
852
853.pl-group-h {
854 font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase;
855 color: var(--pl-text-4); margin: 24px 0 12px;
856}
857.pl-group-h .pl-phase { color: var(--pl-text-3); }
858.pl-card {
859 border: 1px solid var(--pl-border-subtle); border-radius: 10px;
860 margin-bottom: 12px; background: var(--pl-bg); overflow: hidden;
861 padding: 14px 18px;
862}
863.pl-card.pl-open { border-color: var(--pl-border); background: var(--pl-surface); }
864.pl-head {
865 width: 100%; display: flex; align-items: baseline; gap: 12px;
866 border: none; background: transparent; text-align: left; padding: 0;
867}
868.pl-head:focus-visible { outline: 2px solid var(--pl-accent); outline-offset: 2px; border-radius: 6px; }
869.pl-title {
870 flex: 1; font-size: 17px; font-weight: 500; color: var(--pl-text);
871 white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
872}
873.pl-prompt-preview {
874 display: block; font-family: var(--pl-mono); font-size: 13.5px; color: var(--pl-text-3);
875 margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
876}
877.pl-chip {
878 font-size: 11px; letter-spacing: 0.05em; text-transform: uppercase;
879 padding: 3px 9px; border-radius: 999px; flex-shrink: 0;
880 background: var(--pl-accent-bg); color: var(--pl-accent);
881}
882
883.pl-body { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--pl-border-subtle); }
884.pl-label {
885 font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase;
886 color: var(--pl-text-4); margin: 12px 0 8px;
887}
888.pl-prompt-box {
889 display: flex; align-items: center; gap: 10px;
890 padding: 14px 16px; background: #141413; color: #f0eee6;
891 border-radius: 8px; font-family: var(--pl-mono); font-size: 15px;
892}
893.pl-caret { color: var(--pl-accent); flex-shrink: 0; }
894.pl-prompt-box code { flex: 1; background: none; padding: 0; color: inherit; white-space: pre-wrap; line-height: 1.9; }
895.pl-slot {
896 font-family: var(--pl-mono); font-size: inherit;
897 background: rgba(217,119,87,0.15); color: #f0eee6;
898 border: none; border-bottom: 1.5px dashed var(--pl-accent);
899 border-radius: 4px 4px 0 0; padding: 2px 6px; margin: 0 1px;
900 outline: none; min-width: 6ch; max-width: 100%;
901 box-sizing: content-box; cursor: text;
902}
903.pl-slot:hover { background: rgba(217,119,87,0.22); }
904.pl-slot:focus { background: rgba(217,119,87,0.28); border-bottom-style: solid; }
905.pl-slot::placeholder { color: rgba(240,238,230,0.4); font-style: italic; }
906.pl-hint { font-size: 14px; color: var(--pl-text-3); margin: 0 0 10px; }
907.pl-paste { color: var(--pl-text-2); }
908.pl-needs { color: var(--pl-text-2); }
909.pl-needs-label {
910 display: inline-block; font-size: 10.5px; letter-spacing: 0.06em;
911 text-transform: uppercase; padding: 2px 7px; margin-right: 6px;
912 border-radius: 4px; background: var(--pl-accent-bg); color: var(--pl-accent);
913}
914.pl-hint-chip {
915 font-family: var(--pl-mono); font-size: 0.92em;
916 background: var(--pl-accent-bg); color: var(--pl-accent);
917 border-bottom: 1.5px dashed var(--pl-accent);
918 border-radius: 3px 3px 0 0; padding: 1px 5px;
919}
920.pl-copy {
921 font-size: 12.5px; padding: 6px 12px; border-radius: 6px;
922 background: var(--pl-accent); color: #fff; border: none; flex-shrink: 0;
923}
924.pl-teaches { display: block; font-size: 15.5px; color: var(--pl-text-2); margin: 4px 0 0; line-height: 1.6; }
925.pl-match {
926 display: block; font-size: 13.5px; color: var(--pl-text-3);
927 margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
928}
929.pl-match mark { background: var(--pl-accent-bg); color: var(--pl-text); padding: 1px 2px; border-radius: 3px; }
930.pl-next {
931 display: flex; align-items: baseline; gap: 10px;
932 margin: 14px 0 0; padding: 10px 12px;
933 background: var(--pl-accent-bg); border-radius: 8px; font-size: 14.5px;
934}
935.pl-next-label {
936 font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
937 color: var(--pl-accent); font-weight: 600; flex-shrink: 0;
938}
939.pl-src { display: block; font-size: 14px; color: var(--pl-text-4); margin: 14px 0 0; }
940
941.pl-show-all {
942 display: block; width: 100%; padding: 14px; margin-top: 4px;
943 border: 1px dashed var(--pl-border); border-radius: 10px;
944 background: transparent; font-size: 15px; color: var(--pl-accent);
945 text-align: center;
946}
947.pl-show-all:hover { background: var(--pl-accent-bg); border-style: solid; }
948
949.pl-empty {
950 padding: 32px; text-align: center; color: var(--pl-text-4);
951 border: 1px dashed var(--pl-border); border-radius: 10px;
952}
953`, []);
954 if (!mounted) return <div className="pl" style={{
955 minHeight: 480
956 }} />;
957 return <div className="pl">
958 <style>{STYLES}</style>
959
960 <div className="pl-search">
961 <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" style={{
962 color: 'var(--pl-text-4)'
963 }}>
964 <circle cx="11" cy="11" r="7" /><line x1="21" y1="21" x2="16.65" y2="16.65" />
965 </svg>
966 <input type="text" placeholder={L.search} value={q} onChange={e => {
967 setQ(e.target.value);
968 if (e.target.value) setStart(false);
969 }} aria-label={L.search} />
970 </div>
971
972 <div className={'pl-tags' + (ql ? ' pl-dim' : '')}>
973 <button type="button" className={'pl-tag pl-start' + (!ql && start ? ' pl-on' : '')} onClick={() => {
974 setQ('');
975 setStart(!start);
976 if (!start) setSel(null);
977 }}>
978 ★ {L.startHere}
979 </button>
980 <span className="pl-sep" />
981 {TAGS.map(k => <button key={k} type="button" aria-pressed={!ql && sel === k} className={'pl-tag' + (!ql && sel === k ? ' pl-on' : '')} onClick={() => {
982 setQ('');
983 toggleTag(k);
984 }}>
985 {TL(k)}
986 </button>)}
987 {(start || sel || q) && <button type="button" className="pl-clear" onClick={clear}>{L.clear}</button>}
988 <span className="pl-count">{results.length} {results.length === 1 ? L.prompt : L.prompts}</span>
989 </div>
990
991 {results.length === 0 ? <div className="pl-empty">
992 {L.noMatch} {ql ? <code>{q}</code> : null} <button type="button" className="pl-clear" onClick={clear}>{L.clear}</button>
993 </div> : !ql && start ? <div>
994 <div className="pl-group-h">{L.startHereHeader}</div>
995 {results.map(card)}
996 <button type="button" className="pl-show-all" onClick={clear}>
997 {L.showAll && L.showAll.replace('{n}', PROMPTS.length)} →
998 </button>
999 </div> : grouped.map(g => <div key={g.sdlc + '|' + g.cat}>
1000 <div className="pl-group-h"><span className="pl-phase">{phaseLabels[g.sdlc] || g.sdlc}</span> · {catLabels[g.cat] || g.cat}</div>
1001 {g.items.map(card)}
1002 </div>)}
1003 </div>;
1004};
1005
1006This is a library of prompts to copy into Claude Code. Use it to explore ways of working you haven't tried, or when you're not sure where to start.9This is a library of prompts to copy into Claude Code. Use it to explore ways of working you haven't tried, or when you're not sure where to start.
1007 10
1008The prompts are collected from various Anthropic guides, including [Common workflows](/docs/en/common-workflows), [Best practices](/docs/en/best-practices), and [How Anthropic teams use Claude Code](https://claude.com/blog/how-anthropic-teams-use-claude-code). They're starting points rather than scripts. Open **Why this works** under any prompt to see the pattern behind it so you can write your own.11The prompts are collected from various Anthropic guides, including [Common workflows](/docs/en/common-workflows), [Best practices](/docs/en/best-practices), and [How Anthropic teams use Claude Code](https://claude.com/blog/how-anthropic-teams-use-claude-code). They're starting points rather than scripts. Open **Why this works** under any prompt to see the pattern behind it so you can write your own.
1009 12
1010export const labels = {
1011 startHere: "Start here",
1012 startHereHeader: "Five prompts to try first",
1013 showAll: "Show all {n} prompts",
1014 search: "Search prompts…",
1015 clear: "Clear",
1016 prompt: "prompt",
1017 prompts: "prompts",
1018 noMatch: "No prompts match",
1019 fillAndCopy: "Fill in and copy",
1020 copyThis: "Copy this prompt",
1021 hintBefore: "Type in the",
1022 hintChip: "highlighted",
1023 hintAfter: "fields to customize, then copy.",
1024 copy: "Copy",
1025 copied: "Copied",
1026 whyWorks: "Why this works",
1027 makeItStick: "Make it stick",
1028 from: "From",
1029 paste: {
1030 mockup: "Paste, drag, or @-mention your mockup image, then send this:",
1031 design: "Paste, drag, or @-mention your design image, then send this:",
1032 screenshot: "Paste, drag, or @-mention your screenshot, then send this:",
1033 plan: "Paste your plan output into the prompt first, then send this:",
1034 error: "Paste the error output into the prompt first, then send this:",
1035 csv: "Drag your file into the prompt, or replace the path below with an @-mention of your own:"
1036 },
1037 needsLabel: "Needs",
1038 needs: {
1039 tracker: "your issue tracker added as a [claude.ai connector](/docs/en/mcp#use-mcp-servers-from-claude-ai) or [MCP server](/docs/en/mcp).",
1040 gh: "the [gh CLI](https://cli.github.com) authenticated, or GitHub added as a [claude.ai connector](/docs/en/mcp#use-mcp-servers-from-claude-ai).",
1041 browser: "a way for Claude to render and screenshot the result. The [Desktop app](/docs/en/desktop#preview-your-app) has this built in. In the terminal, install the [Chrome extension](/docs/en/chrome) or a Playwright [MCP](/docs/en/mcp) server.",
1042 db: "your data warehouse or log store added as a [claude.ai connector](/docs/en/mcp#use-mcp-servers-from-claude-ai) or [MCP server](/docs/en/mcp)."
1043 }
1044};
1045
1046export const tagLabels = {
1047 understand: "Understand",
1048 plan: "Plan",
1049 prototype: "Prototype",
1050 build: "Build",
1051 test: "Test",
1052 refactor: "Refactor",
1053 review: "Review",
1054 steer: "Steer",
1055 debug: "Debug",
1056 git: "Git",
1057 release: "Release",
1058 data: "Data",
1059 automate: "Automate",
1060 pm: "Product",
1061 design: "Design",
1062 docs: "Docs",
1063 marketing: "Marketing",
1064 security: "Security",
1065 ops: "On-call"
1066};
1067
1068export const phaseLabels = {
1069 discover: "Discover",
1070 design: "Design",
1071 build: "Build",
1072 ship: "Ship",
1073 operate: "Operate"
1074};
1075
1076export const sourceLabels = {
1077 workflows: "Common workflows",
1078 teams: "How Anthropic teams use Claude Code",
1079 legal: "How Anthropic uses Claude in Legal",
1080 cybersecurity: "How Anthropic uses Claude in Cybersecurity",
1081 "best-practices": "Best practices",
1082 ebook: "Scaling agentic coding guide"
1083};
1084
1085export const catLabels = {
1086 Onboard: "Onboard",
1087 Understand: "Understand",
1088 Plan: "Plan",
1089 Prototype: "Prototype",
1090 Implement: "Implement",
1091 Test: "Test",
1092 Refactor: "Refactor",
1093 Review: "Review",
1094 Steer: "Steer",
1095 Git: "Git",
1096 Release: "Release",
1097 Debug: "Debug",
1098 Incident: "Incident",
1099 Data: "Data",
1100 Automate: "Automate"
1101};
1102
1103export const text = {
1104 "get-oriented-in-a": {
1105 title: "Get oriented in a new repository",
1106 teaches: "Describe what you want to know, not which files to read. Claude explores the project on its own and returns a summary of how it fits together.",
1107 next: "Run `/init` to set up `CLAUDE.md` so Claude remembers this every session",
1108 prompt: "give me an overview of this codebase: architecture, key directories, and how the pieces connect"
1109 },
1110 "explain-unfamiliar-code": {
1111 title: "Explain unfamiliar code",
1112 teaches: "Name the file and say what format you want the answer in. Swap the HTML page for a diagram, bullet points, or whatever fits how you learn.",
1113 next: "Set an output style so Claude always explains in your preferred format",
1114 prompt: "explain what {path} does and how data flows through it. write it up as {format}",
1115 slots: {
1116 path: "src/scheduler/queue.ts",
1117 format: "an HTML page with a diagram, then open it in my browser"
1118 }
1119 },
1120 "find-where-something-happens": {
1121 title: "Find where something happens",
1122 teaches: "Search by behavior instead of by filename. The search works even when you don't know what the file is called or which directory it lives in.",
1123 prompt: "where do we {behavior}?",
1124 slots: {
1125 behavior: "validate uploaded file types"
1126 }
1127 },
1128 "see-what-depends-on": {
1129 title: "Check what breaks before you delete",
1130 teaches: "Ask before you remove anything. The list of callers and downstream effects tells you whether you're looking at a one-line cleanup or a change you need to coordinate.",
1131 prompt: "what would break if I deleted {target}?",
1132 slots: {
1133 target: "the retryWithBackoff helper"
1134 }
1135 },
1136 "trace-how-code-evolved": {
1137 title: "Trace how code evolved",
1138 teaches: "Point at commit history when the question is why, not what. Claude reads the log and blame for whatever version control you use and explains the decisions behind the current implementation.",
1139 prompt: "look through the commit history of {path} and summarize how it evolved and why",
1140 slots: {
1141 path: "internal/auth/session.go"
1142 }
1143 },
1144 "scope-a-change-before": {
1145 title: "Scope a change before you start",
1146 teaches: "Size the work before you commit it to a roadmap. The file list tells you whether you're looking at one component or a cross-cutting change.",
1147 prompt: "which files would I need to touch to {change}?",
1148 slots: {
1149 change: "add a dark mode toggle to settings"
1150 }
1151 },
1152 "ask-the-codebase-a": {
1153 title: "Ask the codebase a product question",
1154 teaches: "State your role so the answer is pitched at the right level. Claude explains what the product actually does from the source code, without you needing to read it.",
1155 next: "Set an output style so Claude always pitches answers at this level",
1156 prompt: "I am a {role}. walk me through what happens when a user {action}, from the UI down to the result",
1157 slots: {
1158 role: "PM",
1159 action: "clicks Export to PDF"
1160 }
1161 },
1162 "plan-a-multi-file": {
1163 title: "Plan a multi-file change before touching code",
1164 teaches: "Adding \"don't edit yet\" separates exploration from changes, so you see the approach before any code moves. To make plan-first the default on every prompt, press Shift+Tab for [plan mode](/docs/en/permission-modes#analyze-before-you-edit-with-plan-mode).",
1165 prompt: "plan how to refactor the {target} to {goal}. list the files you would change, but don't edit anything yet",
1166 slots: {
1167 target: "payment module",
1168 goal: "support multiple currencies"
1169 }
1170 },
1171 "draft-a-spec-by": {
1172 title: "Draft a spec by interview",
1173 teaches: "Ask to be interviewed instead of writing the spec yourself. Claude asks you structured questions until the requirements are complete, then writes the result to a file.",
1174 next: "Save your interview questions as a `/spec` skill so every spec starts the same way",
1175 prompt: "I want to build {feature}. interview me about implementation, UX, edge cases, and tradeoffs until we have covered everything, then write the spec to SPEC.md",
1176 slots: {
1177 feature: "per-workspace rate limits"
1178 }
1179 },
1180 "turn-a-meeting-into": {
1181 title: "Turn a meeting into tickets",
1182 teaches: "Skip the transcription step. Claude pulls action items from the unstructured input and writes them straight into your tracker via [MCP](/docs/en/mcp), so you review the tickets, not the transcript.",
1183 next: "Save this as a `/tickets` skill",
1184 prompt: "read {input} and write up the action items, then create a ticket in {tracker} for each one, with acceptance criteria",
1185 slots: {
1186 input: "@meeting-notes.md",
1187 tracker: "our issue tracker"
1188 }
1189 },
1190 "map-edge-cases-before": {
1191 title: "Map edge cases before building",
1192 teaches: "Ask for what's missing, not what's there. Claude lists the error states, empty states, and edge cases a happy-path design tends to skip.",
1193 prompt: "list the error states, empty states, and edge cases for {feature} that the design needs to cover",
1194 slots: {
1195 feature: "the file upload flow"
1196 }
1197 },
1198 "turn-a-mockup-into": {
1199 title: "Turn a mockup into a working prototype",
1200 teaches: "A clickable prototype answers questions a static mockup can't. Hand the working code to engineering instead of explaining the interactions in a doc.",
1201 prompt: "here is a mockup. build a working prototype I can click through, matching the layout and states shown"
1202 },
1203 "implement-from-a-screenshot": {
1204 title: "Implement from a screenshot and self-check",
1205 teaches: "This gives Claude a verification loop: it renders, compares against the source image, and iterates without you pointing out each gap.",
1206 next: "Use `/goal` to keep Claude iterating toward matching screenshots",
1207 prompt: "implement this design, then take a screenshot of the result, compare it to the original, and fix any differences"
1208 },
1209 "follow-an-existing-pattern": {
1210 title: "Follow an existing pattern",
1211 teaches: "Point at code you already like. Without a reference, Claude defaults to general best practices. With one, it matches the conventions your codebase actually uses.",
1212 next: "Ask Claude to write the pattern it followed into `CLAUDE.md` so future sessions match it without the reference",
1213 prompt: "look at how {example} is implemented to understand the pattern, then build {new} the same way",
1214 slots: {
1215 example: "the existing webhook handler",
1216 new: "a payments webhook handler"
1217 }
1218 },
1219 "add-a-small-well": {
1220 title: "Add a small, well-defined feature",
1221 teaches: "State the inputs and outputs, not how to build it. Claude finds where similar code lives and adds yours alongside it.",
1222 prompt: "add a {endpoint} endpoint that returns {payload}",
1223 slots: {
1224 endpoint: "/health",
1225 payload: "the app version and uptime"
1226 }
1227 },
1228 "build-a-small-internal": {
1229 title: "Build a small internal tool from scratch",
1230 teaches: "You don't need a project, a framework, or a build step. Describe the tool and ask Claude to open it so you see it working immediately.",
1231 prompt: "create a {tool} using HTML, CSS, and vanilla JavaScript, then open it in my browser",
1232 slots: {
1233 tool: "drag-and-drop Kanban board with three columns"
1234 }
1235 },
1236 "work-an-issue-end": {
1237 title: "Work an issue end to end",
1238 teaches: "Give the issue number, not a summary. Claude reads the full ticket itself, so requirements you'd forget to mention come through, and it validates the change before reporting back.",
1239 prompt: "read issue #{issue}, implement the fix, and run the tests",
1240 slots: {
1241 issue: "312"
1242 }
1243 },
1244 "find-and-update-copy": {
1245 title: "Find and update copy across the codebase",
1246 teaches: "Ask for variants and say what to skip. Claude finds phrasings a literal search would miss and leaves test fixtures and history untouched, so you review only the copy users actually see.",
1247 prompt: "find every place we say \"{copy}\" or a close variant, show me each one in context, then update them all to \"{new}\". leave tests and the changelog alone",
1248 slots: {
1249 copy: "Sign up free",
1250 new: "Start free trial"
1251 }
1252 },
1253 "draft-from-past-examples": {
1254 title: "Draft a document from past examples",
1255 teaches: "Point at a folder of finished work instead of describing your style. Claude learns the structure and voice from what you've already shipped, so the first draft reads like one of yours.",
1256 next: "Save the voice as a skill so every draft starts there",
1257 prompt: "read the {examples} in {folder} to learn the structure and voice, then draft a new one for {topic}",
1258 slots: {
1259 examples: "privacy impact assessments",
1260 folder: "legal/pia/",
1261 topic: "the new analytics integration"
1262 }
1263 },
1264 "write-tests-run-them": {
1265 title: "Write tests, run them, fix failures",
1266 teaches: "Ask for write, run, and fix together so Claude iterates without stopping for instructions.",
1267 next: "Run `/init` so Claude learns your test command automatically",
1268 prompt: "write tests for {path}, run them, and fix any failures",
1269 slots: {
1270 path: "app/parsers/feed.py"
1271 }
1272 },
1273 "drive-implementation-from-tests": {
1274 title: "Drive implementation from tests",
1275 teaches: "Test-driven development: the tests define when the work is complete, and Claude iterates on the implementation until they pass.",
1276 prompt: "write tests for {feature} first, then implement it until they pass",
1277 slots: {
1278 feature: "the password reset flow"
1279 }
1280 },
1281 "fill-gaps-from-a": {
1282 title: "Fill gaps from a coverage report",
1283 teaches: "Point at the coverage report instead of guessing what's untested. Claude reads the actual numbers and writes tests for the files that need them most.",
1284 next: "Set this as a `/goal` so Claude keeps writing tests toward the coverage target",
1285 prompt: "read {report} and add tests for the lowest-covered files until each is above {target}%",
1286 slots: {
1287 report: "coverage/coverage-summary.json",
1288 target: "80"
1289 }
1290 },
1291 "port-code-between-languages": {
1292 title: "Port code to another language",
1293 teaches: "Say what to preserve, not just the target language. Naming the API or behavior that must stay the same gives Claude a contract to check the port against.",
1294 prompt: "port {source} to {target}, keeping the same {keep}",
1295 slots: {
1296 source: "this Python module",
1297 target: "Rust",
1298 keep: "public API and test behavior"
1299 }
1300 },
1301 "generate-docs-for-code": {
1302 title: "Generate docs for undocumented code",
1303 teaches: "Name the scope and the format. Claude finds what's missing and matches the comment style already in the file, so the new docs read like the rest.",
1304 prompt: "find {scope} without {format} comments and add them, matching the style already used in the file",
1305 slots: {
1306 scope: "the public functions in src/auth/",
1307 format: "JSDoc"
1308 }
1309 },
1310 "migrate-a-pattern-across": {
1311 title: "Migrate a pattern across the codebase",
1312 teaches: "Describe the old pattern and the new one. Asking Claude to identify every place first means the call sites are listed in the response, so you can check none were missed. For a migration across many files, run [/batch](/docs/en/commands). Claude splits the work into units for you to approve, then background subagents make the changes.",
1313 prompt: "migrate everything from {from} to {to}: identify every place that needs to change, then make the changes",
1314 slots: {
1315 from: "the old logging API",
1316 to: "the structured logger"
1317 }
1318 },
1319 "optimize-against-a-measurable": {
1320 title: "Optimize against a measurable target",
1321 teaches: "Stating the metric and target gives Claude a clear definition of done.",
1322 next: "Set this as a `/goal` so Claude keeps measuring and iterating toward the number",
1323 prompt: "optimize {target} to bring {metric} from {current} down to under {goal}",
1324 slots: {
1325 target: "the search query",
1326 metric: "p95 latency",
1327 current: "2s",
1328 goal: "500ms"
1329 }
1330 },
1331 "fix-a-precise-visual": {
1332 title: "Fix a precise visual bug",
1333 teaches: "Precise visual feedback gets a precise fix. State the exact element, measurement, and viewport.",
1334 next: "Add a preview tool so Claude screenshots and verifies the fix itself",
1335 prompt: "the {element} extends {amount} beyond the {container} on {viewport}. fix it.",
1336 slots: {
1337 element: "login button",
1338 amount: "20px",
1339 container: "card border",
1340 viewport: "mobile"
1341 }
1342 },
1343 "review-your-changes-before": {
1344 title: "Review your changes before you commit",
1345 teaches: "Catch problems while they take less work to fix. Claude reads the changed files in full, not just the diff lines, so it spots issues a quick self-review misses.",
1346 next: "Run `/code-review` for the same check in one command",
1347 prompt: "review my uncommitted changes and flag anything that looks risky before I commit"
1348 },
1349 "review-a-pull-request": {
1350 title: "Review a pull request",
1351 teaches: "Claude reviews with the whole codebase in context, not just the diff. It reads the changed code and what it calls, so it catches problems a diff-only review would miss.",
1352 next: "Run `/code-review <pr#>` in one command, or turn on Code Review for every PR",
1353 prompt: "review PR #{pr} and summarize what changed, then list any concerns",
1354 slots: {
1355 pr: "247"
1356 }
1357 },
1358 "review-infrastructure-changes-before": {
1359 title: "Review infrastructure changes before applying",
1360 teaches: "Plan output is dense and hard to scan. Pasting it gets you a plain-language summary of what's actually going to change before you apply it.",
1361 prompt: "here is my Terraform plan output. what is this going to do, and is anything here going to cause problems?"
1362 },
1363 "run-a-security-review": {
1364 title: "Run a security review with a subagent",
1365 teaches: "A [subagent](/docs/en/sub-agents) runs the audit in its own context window and reports back a summary, so a long security review doesn't fill up your main session. The built-in general-purpose subagent handles this without extra setup.",
1366 next: "Set up a dedicated security-review subagent your whole team can use",
1367 prompt: "use a subagent to review {path} for security issues and report what it finds",
1368 slots: {
1369 path: "src/api/"
1370 }
1371 },
1372 "review-content-before-sending": {
1373 title: "Catch issues before formal review",
1374 teaches: "Get a first pass before a human spends time on it. Name the concerns you want checked so the review is focused, then fix what it finds and send a cleaner draft.",
1375 next: "Capture your review checklist as a skill your whole team can run",
1376 prompt: "review {file} for {concerns} and list anything I should fix before it goes to {reviewer}",
1377 slots: {
1378 file: "launch-post.md",
1379 concerns: "unsupported claims, missing attributions, and brand-guideline issues",
1380 reviewer: "legal"
1381 }
1382 },
1383 "course-correct-a-wrong": {
1384 title: "Course-correct a wrong approach",
1385 teaches: "Name the constraint Claude missed, not just that it's wrong. A specific reason gives Claude a concrete constraint to satisfy on the retry, instead of guessing again.",
1386 next: "Press `Esc` twice to open the rewind menu and restore code and conversation so the retry starts clean",
1387 prompt: "that is not right: {feedback}. try a different approach",
1388 slots: {
1389 feedback: "the function signature needs to stay backward-compatible"
1390 }
1391 },
1392 "narrow-the-scope-of": {
1393 title: "Narrow the scope of a change",
1394 teaches: "When the direction is right but the change went too broad, ask Claude to keep part of it rather than rewinding everything. A stated boundary keeps a small fix from becoming a refactor.",
1395 prompt: "that is too much. keep only the changes to {scope} and undo your other edits",
1396 slots: {
1397 scope: "the validation logic in src/forms/"
1398 }
1399 },
1400 "turn-a-correction-into": {
1401 title: "Turn a correction into a rule",
1402 teaches: "A correction in chat isn't shared with your team. A rule in the project's [CLAUDE.md](/docs/en/memory) is shared once you commit it, and Claude reads it at the start of every session.",
1403 next: "Open `/memory` to review what Claude wrote",
1404 prompt: "you keep {mistake}. add a rule to CLAUDE.md so this stops happening",
1405 slots: {
1406 mistake: "using default exports when this project uses named exports"
1407 }
1408 },
1409 "resolve-merge-conflicts": {
1410 title: "Resolve merge conflicts",
1411 teaches: "Say what state you want, not which markers to keep. Asking for the reasoning makes the merge reviewable instead of a black box.",
1412 prompt: "resolve the merge conflicts in this branch and explain what you kept from each side"
1413 },
1414 "commit-with-a-generated": {
1415 title: "Commit with a generated message",
1416 teaches: "Let Claude derive the message from the diff. It matches your repository's existing commit style.",
1417 prompt: "commit these changes with a message that summarizes what I did"
1418 },
1419 "open-a-pull-request": {
1420 title: "Open a pull request from a ticket",
1421 teaches: "Skip the context switch between tracker, editor, and GitHub. One prompt reads the spec, makes the change, and opens the PR.",
1422 prompt: "find the ticket about {topic} in {tracker} and open a PR that implements it",
1423 slots: {
1424 tracker: "our issue tracker",
1425 topic: "the login timeout"
1426 }
1427 },
1428 "draft-release-notes-from": {
1429 title: "Draft release notes from git history",
1430 teaches: "Give two reference points and the structure you want. Claude reads the commit log between them and drafts a changelog you can edit.",
1431 next: "Save this as a `/changelog` skill",
1432 prompt: "compare {from} to {to} and draft release notes grouped by feature, fix, and breaking change",
1433 slots: {
1434 from: "v2.3.0",
1435 to: "v2.4.0"
1436 }
1437 },
1438 "write-a-ci-workflow": {
1439 title: "Write a CI workflow",
1440 teaches: "Describe when it should run and what it should do; the YAML is generated for you, matched to your project's build and test commands.",
1441 prompt: "write a GitHub Actions workflow that {steps} on every push to {branch}",
1442 slots: {
1443 steps: "runs the tests and deploys to staging",
1444 branch: "main"
1445 }
1446 },
1447 "find-and-fix-a": {
1448 title: "Find and fix a failing test",
1449 teaches: "Describe the symptom; you don't need to know which file is broken. Claude runs the test to see the failure, traces it into source, and fixes it.",
1450 prompt: "the {test} test is failing, find out why and fix it",
1451 slots: {
1452 test: "UserAuth"
1453 }
1454 },
1455 "investigate-a-reported-error": {
1456 title: "Investigate a reported error",
1457 teaches: "Describe the symptom and location; Claude reads the relevant code path and traces likely causes. Paste stack traces or logs if you have them.",
1458 next: "Put a deeplink in your runbook that opens Claude with this prompt pre-filled",
1459 prompt: "users are seeing {symptom} on {where}. investigate and tell me what is going on",
1460 slots: {
1461 symptom: "500 errors",
1462 where: "/api/settings"
1463 }
1464 },
1465 "fix-a-build-error": {
1466 title: "Fix a build error at the root",
1467 teaches: "Asking for root cause and verification prevents surface-level patches that suppress the error without fixing it.",
1468 prompt: "here is a build error. fix the root cause and verify the build succeeds"
1469 },
1470 "investigate-a-production-incident": {
1471 title: "Investigate a production incident",
1472 teaches: "List the evidence sources to correlate, not the steps to take. Claude reads logs, git history, and config together to narrow the cause.",
1473 next: "Connect your error tracker or log store via MCP",
1474 prompt: "{symptom}. check the logs, recent deploys, and config changes, then tell me the most likely cause",
1475 slots: {
1476 symptom: "the checkout endpoint started returning 500s an hour ago"
1477 }
1478 },
1479 "query-logs-in-plain": {
1480 title: "Query logs in plain English",
1481 teaches: "Ask the question instead of writing the SQL. Claude builds the query, runs it against your connected logs, and shows both the query and the result so you can check what ran.",
1482 prompt: "show me all {events} for {scope} over {timeframe}. write the query, run it, and tell me what stands out",
1483 slots: {
1484 events: "failed logins",
1485 scope: "the auth service",
1486 timeframe: "the past 24 hours"
1487 }
1488 },
1489 "diagnose-from-a-console": {
1490 title: "Diagnose from a console screenshot",
1491 teaches: "Cloud consoles show you the problem but not the commands to fix it. Claude reads the screenshot and translates the dashboard into the kubectl, gcloud, or aws commands to run.",
1492 prompt: "here is a screenshot of {console}. walk me through why {resource} is failing and give me the exact commands to fix it",
1493 slots: {
1494 console: "our Kubernetes dashboard",
1495 resource: "this pod"
1496 }
1497 },
1498 "analyze-a-data-file": {
1499 title: "Analyze a data file",
1500 teaches: "A one-off question doesn't need a one-off script. Point at a file in your project folder and Claude reads it directly, finds the patterns, and writes the output where you ask.",
1501 next: "Connect the data source via MCP instead of exporting files",
1502 prompt: "read {file}, summarize the key patterns, and write the results to {output}",
1503 slots: {
1504 file: "@reports/q1-signups.csv",
1505 output: "an HTML page with charts, then open it in my browser"
1506 }
1507 },
1508 "generate-variations-from-performance": {
1509 title: "Generate variations from performance data",
1510 teaches: "State the constraint at the start so generation stays within the limit. Claude reads the metrics, picks what to replace, and produces alternatives that fit.",
1511 next: "Connect the ad platform via MCP instead of exporting a file",
1512 prompt: "read {file}, find the underperforming {items}, and generate {n} new variations that stay under {limit} characters",
1513 slots: {
1514 file: "@ads-performance.csv",
1515 items: "headlines",
1516 n: "20",
1517 limit: "90"
1518 }
1519 },
1520 "turn-a-recurring-task": {
1521 title: "Turn a recurring task into a skill",
1522 teaches: "Name the steps once; reuse them as a command. Claude writes a [skill](/docs/en/skills) anyone on your team can run.",
1523 prompt: "create a /{name} skill for this project that {steps}",
1524 slots: {
1525 name: "ship",
1526 steps: "runs the linter and tests, then drafts a commit message"
1527 }
1528 },
1529 "add-a-hook-for": {
1530 title: "Add a hook for repeat behavior",
1531 teaches: "Hooks make a behavior automatic instead of something you have to remember to ask for. Describe the trigger and action and Claude writes the [hook](/docs/en/hooks) configuration.",
1532 prompt: "write a hook that {action} after every {event}",
1533 slots: {
1534 action: "runs prettier",
1535 event: "edit to a .ts or .tsx file"
1536 }
1537 },
1538 "connect-a-tool-with": {
1539 title: "Connect a tool with MCP",
1540 teaches: "Connect the source once instead of pasting data every session. After [MCP](/docs/en/mcp) setup, Claude reads from the tool directly when you ask about it.",
1541 prompt: "connect {server} via MCP so you can read its {data} directly",
1542 slots: {
1543 server: "our error tracker",
1544 data: "stack traces"
1545 }
1546 },
1547 "capture-what-to-remember": {
1548 title: "Capture what to remember for next time",
1549 teaches: "Ask before you forget. Claude knows what it had to figure out this session and proposes [CLAUDE.md](/docs/en/memory) entries so the next session starts with that context.",
1550 prompt: "summarize what we did this session and suggest what to add to CLAUDE.md"
1551 }
1552};
1553
1554<PromptLibrary text={text} labels={labels} tagLabels={tagLabels} phaseLabels={phaseLabels} sourceLabels={sourceLabels} catLabels={catLabels} />
1555
1556## What makes these prompts work13## What makes these prompts work
1557 14
1558The prompts above share a few patterns. Recognizing them helps you adapt any prompt here to your own task.15The prompts above share a few patterns. Recognizing them helps you adapt any prompt here to your own task.
