Install

Run Vynix on any site

Two ways, the same agent-ready capture: drop in one dependency-free script tag, or add the Chrome extension and capture with no code. Pick whichever fits.

Both capture the same agent-ready context and feed the same dashboard, MCP server and GitHub handoff.

Embed the widget

One script tag. Any stack.

Best for your own production or staging site: always on for your whole team and your visitors.

✓
2
3
<script
  sr
✓Widget connected. Launcher is live on your site.
Point at any element and leave a note.1

Add the widget script

Paste this just before your closing </body> tag on every page you want to capture, then swap YOUR_PROJECT_KEY for your project’s key from the dashboard.

index.html
<script
  src="https://cdn.vynix.in/widget.js"
  data-project-key="YOUR_PROJECT_KEY"
  data-api="https://www.vynix.in"
  defer
></script>

Loads deferred from our CDN and runs isolated in a Shadow DOM, so it never blocks rendering or clashes with your site’s styles.

Three steps

Live in under two minutes

01

Create a project

Sign in, create a project for your site, and copy its public project key from the dashboard.

02

Add one script tag

Paste the snippet just before your closing </body> tag. It loads deferred and never blocks rendering.

03

Start annotating

Open your site, click the Vynix launcher, point at any element and leave a note. That’s it.

Compatibility

Works with your stack

Because it’s a plain script isolated in a Shadow DOM, Vynix runs the same everywhere: no plugin, no build step.

Static HTML
PHP
WordPress
Laravel
React
Vue
Next.js
Svelte
Configuration

Script attributes

data-project-keyrequired

Your project’s public key from the dashboard. Tells Vynix where annotations belong.

data-apirequired

Your Vynix API base URL.

data-capture-diagnosticsoptional

Set to "false" to disable console & network capture. Defaults to true.

data-themeoptional

"auto" (default), "light" or "dark" to match your site.

deferoptional

Recommended. Loads the widget without blocking your page.

Or skip the code

Prefer no setup? Add the extension.

Same Vynix, nothing to install on your site. Pin the extension and capture on any page, even one you do not own.

No code, any site

Vynix lives in your browser

Pin the extension and point-and-capture on any page: your own app, a staging build, a client’s site, even one you do not own. No snippet, no deploy.

  • Works on any website, the moment you click the icon.
  • Nothing to add to your site. Perfect for QA and agencies.
  • The same agent-ready capture as the embedded widget.
Add to ChromeFree · Works in Chrome, Edge & Brave
app.acme.io/checkout
Checkout
1
#1 button.checkout

“make this primary and a larger tap target”

Connect your agent

Add the MCP server

Register the Vynix MCP server with any compatible client to let your agent read and resolve annotations directly. Add this to your client’s MCP config and restart it.

  • Use a personal token from your dashboard.
  • Point VYNIX_API at your Vynix instance.
  • Then ask your agent: “what feedback do I have?”
mcp.json
{
  "mcpServers": {
    "vynix": {
      "command": "npx",
      "args": ["-y", "@usevynix/mcp-server"],
      "env": {
        "VYNIX_API_URL": "https://www.vynix.in",
        "VYNIX_API_TOKEN": "your_personal_token"
      }
    }
  }
}

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.

Get started freeRead the install guide