Live demo room site_demo / page:/demo

Embeddable comments, cursors, drawing, APIs, webhooks, and debug visibility.

This page loads the same vanilla SDK that a site builder would install. Use the floating toolbar to add comments, draw, and open the console or debug dashboard to watch the system update.

Viewport-safe anchors

Comment anchors store normalized page coordinates, element selectors, bounding boxes, text quotes, and viewport metadata so responsive layouts can be repaired instead of guessed.

Generic room core

Threads and drawing are wrappers over the same room, presence, broadcast, state, event, webhook, and dashboard infrastructure that can later power game-like state sync.

Anonymous and JWT identity

Anonymous ids persist in localStorage, session ids persist per tab, and customer JWTs can refresh profile and policy claims without making this service own customer auth.

LiveView debug dashboard

The internal dashboard shows sites, rooms, sessions, durable events, annotation data, webhook delivery attempts, and queue state using the same event envelope.

Try it

Click anywhere on this page while Comment mode is active.
Enter a short comment in the prompt.
Switch to Draw and sketch over the viewport.
Open the site-builder console or debug dashboard in another tab.

Embed shape

<script>
  window.getAnnotateToken = async () => customerJwt
</script>
<script
  async
  src="/assets/js/loader.js"
  data-annotate-site="site_demo"
  data-room="page:/demo"
  data-get-token="getAnnotateToken"
  data-panel-open="false"
></script>

Download Loader JS Download SDK JS Open Builder Console Open Debug Dashboard