Drop your first pin
Turn "it's broken on my screen" into a reproducible issue. Learn how a pin captures the browser, element and environment automatically.
On this page
A pin is a comment anchored to a real spot on your live page. Unlike a screenshot, it carries the full environment with it — so the person fixing the issue can reproduce it without a back-and-forth.
Place a pin
- Click the Pogpin launcher to enter comment mode. The cursor turns into a crosshair.
- Click the exact element you want to talk about.
- Type your note and press ⌘/Ctrl + Enter to post.
That’s it. The pin stays attached to that element even as the page reflows.
What gets captured automatically
Every pin records the context your team would otherwise have to ask for:
| Captured | Why it matters |
|---|---|
| Browser & OS | Reproduce environment-specific bugs |
| Screen size & DPR | Catch responsive and retina issues |
| Page URL | Jump straight to the right screen |
| CSS selector | Highlight the exact element later |
| Console errors | See what the page logged at pin time |
Anchor pins that survive layout changes
Pogpin stores a resilient selector plus positional fallbacks, so a pin re-attaches even after you ship a redesign of that section. If an element is removed entirely, the pin is flagged as orphaned so you can decide whether the issue still applies.
Tip: hold Shift while clicking to pin a region instead of a single element — useful for spacing and layout feedback.
Keep moving
Pins are most powerful with a team watching. Next up: invite your team and set roles.