Skip to main content
annot8
DevelopersOne script · < 12kb

Built for developers. Invisible to users.

Add context-aware collaboration to any web app with a single script tag. Zero impact on your bundle, CSS, or CSP. Works on every stack.

Read the docs
Quick start

Two lines. That’s it.

Drop the script tag anywhere before the closing </body> and you’re live. No SDK install, no build-time setup.

index.html
<script async src="https://www.annot8.app/widget.js"
  data-annot8-project="YOUR_PROJECT_ID"></script>
Bundle size
< 12kb gzipped
Load strategy
async · lazy
Frameworks
React · Next · Vue · Svelte · any
CSP
strict · nonce-aware
Widget configuration

Configure anything, override nothing.

Identify the user, scope by environment, pin to a specific release. All optional, all overridable.

data-annot8-projectstring · required

Your project public key.

data-annot8-userJSON

Identify the commenter — name, email, avatar.

data-annot8-envprod | preview | local

Scope threads by environment.

data-annot8-releasestring

Pin threads to a build hash or release tag.

data-annot8-themelight | dark | auto

Match your app’s theme automatically.

app.tsx
import Script from "next/script";

export default function Layout({ children }) {
  return (
    <>
      <Script
        id="annot8-widget"
        strategy="afterInteractive"
        src="https://www.annot8.app/widget.js"
        data-annot8-project={process.env.NEXT_PUBLIC_ANNOT8_PROJECT}
        data-annot8-env="preview"
        data-annot8-release={process.env.VERCEL_GIT_COMMIT_SHA}
        data-annot8-user={JSON.stringify({
          id: user.id,
          name: user.name,
          email: user.email,
        })}
      />
      {children}
    </>
  );
}
Webhooks & events

Every thread, delivered to your stack.

Fire webhooks on capture, triage, routing, and resolution. Retry with exponential backoff, signed with HMAC-SHA256.

POST /your-endpoint
{
  "event": "thread.created",
  "thread": {
    "id": "th_3418",
    "project": "acme-web",
    "url": "https://acme.com/checkout",
    "severity": "P1",
    "context": {
      "build": "3a7f1c9",
      "env": "preview",
      "selector": "button.cta.primary",
      "viewport": "1440x900"
    }
  },
  "created_at": "2026-04-21T13:42:00Z"
}
thread.created

A new comment was pinned.

thread.triaged

AI applied a severity and owner.

thread.routed

Synced to Linear / Jira / GitHub.

thread.resolved

Fix merged and re-verified.

thread.replied

Any new message on the thread.

Signed, not trusted

Verify every webhook with HMAC.

We sign every request with your webhook secret. Rotate keys anytime from the dashboard.

Security & trust

Built for SOC 2. Tested for hostile DOMs.

SOC 2 · GDPR · HIPAA

Type II audited, data encrypted in-transit and at-rest. Region-pinned storage available.

Zero data exfiltration

Widget sandboxed via Shadow DOM. Cannot read your app state or DOM outside its own scope.

CSP-friendly

Nonce-aware, strict-CSP compatible. No eval, no inline styles, no external fonts.

Spin up a test project in 60 seconds.

Free forever on Hobby. No credit card.

Read API docs