How it works

From a click to a committed fix

No screenshots. No selector hunting. No follow-up questions. Here is the whole loop, start to finish.

A live site with Vynix installed
How it works

From a click to a committed fix

Four steps. No screenshots, no selector hunting, no follow-up questions.

01

Point at anything

Click an element or drag a region on your live site. The hovered element highlights and names itself (button, link, input, image) so you always hit the right target.

02

Leave a note

Describe the change in plain language and set a type and priority. Vynix silently records the surrounding context as you write.

03

Capture the context

Page, CSS selector, XPath, DOM snippet, computed styles, viewport, plus recent console errors and failed network requests, attached automatically.

04

Ship the fix

Copy a clean Markdown report or let your agent read it live over MCP. It already knows the element, the intent, and the evidence.

The problem

Vague feedback is expensive

“Make this bigger” sends a human (or an agent) on a guessing expedition. Vynix replaces the back-and-forth with exact, actionable context.

Without Vynix
  • “Make this button bigger.”

    Which button? Which page? What size? Cue a screenshot exchange.

  • “This looks broken on mobile.”

    No element, no viewport, no console error, just a feeling.

  • “The checkout feels off.”

    The agent guesses the selector and edits the wrong component.

With Vynix
  • Exact element: CSS selector, XPath and DOM snippet attached.
  • The page, viewport and computed styles, captured automatically.
  • Console errors and failed requests, so “broken” comes with proof.
  • A clean Markdown report, or live access over MCP.
What gets captured

Context that reads like a perfect bug report

Every annotation arrives with the technical detail an agent would otherwise have to ask for, assembled silently as you type.

Page

  • URL & title
  • Viewport size
  • Browser & device
  • Captured timestamp

Element

  • CSS selector
  • XPath
  • Tag, id & classes
  • Inner text
  • Box & position

Appearance

  • Computed styles
  • DOM snippet
  • Nearest landmark
  • Region screenshot bounds

Runtime

  • Console errors
  • Failed requests
  • Status codes
  • Request timing
Privacy-safe: metadata only, query strings stripped
vynix-feedback.md
## Vynix feedback: acme.store

### #1 · Headline · High
> Tighten this headline and raise contrast, fails AA.

- url: /
- selector: h1.hero__title
- xpath: /html/body/header/h1
- viewport: 1440×900
- styles: color #94a3b8; font-size 28px
- console: TypeError: cannot read 'focus' of null (hero.js:42)
GitHub handoff

Turn a pin into a tracked issue

Push one note (or a whole batch) straight to GitHub. Each issue arrives with the selector, intent and evidence in the body, then assigns itself to Copilot or a teammate so the fix starts itself.

  • Create issues from a single note or an entire batch at once.
  • Auto-assign to GitHub Copilot, a teammate, or leave it for triage.
  • Selector, computed styles and console errors land in the issue body.
  • Status syncs back to Vynix as the issue moves and closes.
github · acme/store
$ vynix push --batch checkout-pass

 opened #412 Make the primary CTA larger
 label: bug · selector: section.hero button.cta
 opened #413 Fix overlapping footer on tablet
 opened #414 Tighten hero headline contrast

 assigned @copilot to 3 issues
 Copilot started a branch on #412

Stop describing bugs. Point at them.

Add one script tag and give your AI agent the context it has been missing. Free while we grow.