Markup

in-page feedback · for the web

Point at
the problem.

Stakeholders drop pinned, threaded comments straight onto the page — with the screenshot, the URL and the element already attached. No more "the button on the thing looks wrong".

Install the widgetOpen the dashboard

npm i @pixelmatters/markup · MIT · ~10kB

how it works · 02

Three steps, no host-app rewrite.

  1. 01

    Drop in the widget

    One script tag or one component. It renders in a shadow root, so it cannot inherit or leak a single style from the host page.

  2. 02

    Anyone leaves a pin

    Click anywhere on the page. Markup captures the element, the route and an optional annotated screenshot, then opens a thread on the spot.

  3. 03

    Triage in the dashboard

    Threads stream in live. Reply, mention a teammate, resolve — and get the digest in Slack instead of chasing screenshots in DMs.

install · 03

Paste one tag. That's the integration.

No build step, no host CSS to reconcile, no framework coupling. The install guide has the React, Vue and Solid variants of the same call, and the version is pinned so a future major release can't change your page without you.

Read the install guide
html
<script type="module">
  import { init } from 'https://esm.sh/@pixelmatters/markup@1.18.3'

  init({
    apiUrl: 'https://your-deployment.convex.site',
    apiKey: 'markup_…',
  })
</script>

for agents · 04

Your coding agent can read the feedback.

Markup speaks the Model Context Protocol. Point Claude Code or Cursor at a project and it can resolve the route it's editing, read what people reported about that page, and act on it — before touching the code.

Set up the MCP server
  • OAuth 2.1, no pasted keysA client registers itself and the user approves it in the browser.
  • Never more than the personAccess is re-resolved from live project membership on every call.
  • Scoped to one projectAn agent sees the threads for the project it was authorised against.

the standard · 05

good
is not
good enough.

Feedback is the shortest path to craft. Collect it from the people who use what you build — on the page, with the screenshot and the element already attached — and reply where the work happens.

Open the dashboardBrowse the docs