Presence
Live avatars show who is viewing and editing, human or agent, the signal users expect from every multiplayer app.
Stop building presence from scratch for a feature users assume exists.
Free tier. No credit card. First comment in 5 minutes.
Who’s in this document right now:
2 active · 1 away · avatars update in real time
7.2 The Provider shall indemnify and hold harmless the Client against all claims arising from the Services provided under this agreement.
7.2 The Provider shall indemnify and hold harmlessMaya the Client against all claims arisingDev from the Services.
each selection is attributed in real time · no conflicts
Following Maya
Your viewport mirrors hers · click anywhere to break free
7.3 Liability shall not exceed the fees paid in the preceding twelve (12) months of service.
Presence running inside products at
See your agents work
Velt Presence adds live avatars showing who is viewing and editing, humans and agents alike. When agents act in your product, your users should never wonder what the AI is doing. Presence shows an agent is in the document. Cursors and live selection show exactly what it is touching, as it touches it. Follow mode lets a user ride along while an agent works, the same way they would follow a teammate. Supervision is not a dashboard somewhere else; it is the same multiplayer primitives your users already understand, with agents as first-class users.
Clause 7: selection by Clause Checker
both actor types in one primitive; supervision visible, no dashboard
How it works
Wrap your app, drop in VeltPresence, and avatars render for everyone on the document. Cursors, selection, and follow mode are sibling one-liners.
npm install @veltdev/react<VeltProvider
apiKey={VELT_API_KEY}>
<YourApp />
</VeltProvider><VeltPresence />
// siblings: <VeltCursor />,
// live selection, and flockModePresence shows everyone online on the document, with heartbeat monitoring behind it. A user goes away after a configurable inactivity window (default 5 minutes) and immediately when their tab loses focus; offline after longer inactivity (default 10 minutes) or on connection loss. maxUsers collapses crowded avatar rows into an overflow count, and locationId scopes presence to a page, tab, or region. Agents and bots enter the same list via addUser() on the client or the Presence REST APIs from your backend. userStateChange events and the presence data API stream everything back to your code.
// heartbeat monitoring · away after 5m or tab unfocus · offline after 10m
Teams get a demo working in weeks; the idle states, reconnects, and fan-out scaling are the parts that never end. The 3 steps above replace the demo; the wall below replaces the long tail.
Skip the steps. Have your agent set it up.
npx -y @velt-js/mcp-installer
claude mcp add velt-installer -- npx -y @velt-js/mcp-installer
npx -y @velt-js/mcp-installer
npx -y @velt-js/mcp-installer
npx -y @velt-js/mcp-installer
Launch presence this week.
No credit card. Works with React, Next.js, Vue, Angular, and HTML.
Capabilities
Each card is the live SDK. Toggle to Code for the exact snippet that renders it.
React
Next.js
Angular
Vue
HTML<VeltPresence maxUsers={5} />Live avatars render for everyone on the document, and maxUsers collapses extras into a single +N avatar. The whole deal team opens the deck without burying your header.
<VeltPresence
inactivityTime={5 * 60_000}
/>Heartbeats mark a user away after configurable inactivity, instantly on tab switch, and offline on connection loss. The “is anyone looking at this forecast” question answers itself.
velt.addUser({
userId: "agent-1", type: "agent",
});addUser or the Presence REST API puts an agent in the avatar row while it works on the record. Your users see the reviewer is in before its findings land.
7.2 The Provider shall indemnify and hold harmless the Client against all claims arising from the Services provided under this agreement.
<VeltCursor />No more real-time plumbing for table stakes: named cursors, or avatars in avatarMode, on every surface, humans and agents alike.
7.2 The Provider shall indemnify and hold harmlessMaya the Client against all claims arisingDev from the Services.
<input data-velt-live-selection />Inputs, text areas, and contenteditable elements broadcast selection automatically; opt any element in. The “what are you looking at?” question answers itself.
<VeltPresence flockMode />No more black-box agent work your users can’t watch: one click rides along with a teammate’s or an agent’s viewport, live.
velt.setLocation({ id: "slide-4" });locationId scopes the avatar row to a page, tab, or region of your app. See who is on this slide, not just somewhere in the deck.
escalate(user)const users = usePresenceData({
statuses: ["away"],
});usePresenceData and userStateChange expose full presence state, queryable by status. Drive your own indicators, or escalate when the assigned reviewer goes idle.
We had cursors, selection, and a working avatar row in an afternoon. The quarter we’d budgeted for reconnects and idle states never happened.
Founding engineer · collaborative editor
Little big details
All items trace to docs pages; engineering sign-off still applies.
Make it yours
Prebuilt components for the fast path, wireframes for fully custom UIs, and configuration, hooks, events, and REST APIs underneath.
Wireframe components for fully custom UIs across the family: Presence, Cursors, and Live Selection; template variables, dark mode, CSS customization. Your avatar row can look nothing like Velt’s defaults.
<VeltPresenceWireframe>
// your avatar markup
</VeltPresenceWireframe>Configuration props (inactivity windows, maxUsers, locations, allowed elements), data subscriptions and hooks, presence events, addUser/removeUser, and the Presence REST APIs for server-driven presence.
velt.addUser({ userId, type: "agent" });
onUserStateChange(handler);Adding the agent to the avatar row changed how users feel about our AI. They can see it working and follow along instead of staring at a spinner.
Product lead · AI-native SaaS
In production
Tabbed by vertical, with verified customer screenshots.
This Digital Sales Room gives you everything you need to move forward — from proposal to plan.
@Fin We need to make a working demo for Rene and his team
Brand, legal, and the client show up in the deck’s avatar row, cursors on the slide they are reading. Nobody re-sends a link to ask who has seen the latest version.For sales enablement
finance / receivables
Can we confirm the PO before approving this one? @Sarah
1 ReplySelection indicators sit on the exact cell each analyst is editing, and presence shows who is in the model right now. Close week runs without two people in one column.For fintech and FP&A
Cotton Supplier Ltd.
AgriCotton Farms
Village Kheda, Gujarat, India
SpinCo Yarns
18 Narol Rd, Gujarat, India
DyeWorks International
Calle de Mayo, Mexico
Can you attach the GOTS cert for this lot before we approve? @Sean
1 ReplyDispatch sees who has the work order open before reassigning it; away and offline states show when the field crew dropped off. The handoff happens once, to someone actually there.For operations
Privacy Risk Review
Wren discovered a feature request in Jira involving users' health data and triggered a review after analyzing the PRD in Confluence against company policy and US regulation.
JStarted by Juan MendezThis feature processes PHI, so HIPAA applies. I recommend a PIA and a vendor BAA review before any data flows. @Juan
Officers show up in the controls register’s avatar row, selection indicators on the exact attestation each is reviewing. Nobody signs off on a line another officer already has open.For compliance
Superflow
1 · Subscription & Fees
Customer subscribes to the Service on a monthly basis and shall pay the then-current fees in advance of each billing period. Fees are non-refundable except as expressly set out in this Agreement.
2 · Term & Auto-Renewal
The subscription renews automatically for successive one-month terms unless either party gives at least thirty (30) days' written notice of non-renewal before the end of the then-current term.
3 · Limitation of Liability
Except for breaches of confidentiality, each party's total aggregate liability under this Agreement shall not exceed the fees paid by Customer in the one (1) month preceding the event giving rise to the claim.
4 · Governing Law
This Agreement is governed by the laws of the State of Delaware, without regard to its conflict-of-laws provisions, and the parties consent to the exclusive jurisdiction of its courts.
Counsel’s cursors sit on the clause they are reading, and presence shows who is in the matter right now. The redline handoff happens once, to someone actually in the document.For legal
Make the hero headline punchier and add a primary CTA.
Done — rewrote the headline, tightened the subtext, and added a primary CTA in hero.tsx.
Add a logo strip with social proof under the CTA.
Added a five-logo trust strip below the CTA and wired it into hero.tsx.
Ship your app in a weekend
Get startedUse our brand orange on the CTA and cut the headline to one line. @Sean
The agent joins the avatar row while it drafts, and follow mode lets the user ride along as it works. Generated work is watchable, not a spinner.For AI-native SaaS
See it running in products like yours.
30 minutes, with an engineer, not a sales deck.
Related primitives
Watching becomes feedback, editing, or a conversation in the document.
When watching becomes feedback, threads anchor it to the element.
This clause needs a liability cap before we send
watchingthreads anchor feedback to the element
Presence shows who is in the work; co-editing lets them change it without overwrites.
7.2 The Provider shall indemnify and hold harmlessMaya the Client against all claims.
presence shows who's inco-editing lets them change it
When presence finds the right person, the conversation starts inside the document.
presence finds the personthe conversation starts in the doc
User identity behind every avatar can stay on your infrastructure via the users data provider, with Velt storing only user IDs. Presence, cursors, and selection run on the same isolation guarantees as the rest of the SDK. See self-hosting and governance.
Book DemoProof
A feature users assume exists, without the ML infrastructure quarter.
1 afternoon
We’d scoped a quarter for presence, cursors, and selection. We shipped all three in an afternoon and spent the quarter on our actual product.
0 dashboards
Our users supervise the agent through the same avatar row and follow mode they already use for teammates. We never built a separate oversight dashboard.
1 handoff
Away and offline states ended the double-assigned work orders. Dispatch sees who actually has the doc open before they reassign.
FAQ
Install @veltdev/react, wrap your app in VeltProvider with your API key, and add the VeltPresence component. Avatars render for everyone on the document; the quickstart walks through it in minutes.
Yes. Add the agent to the presence list with addUser or the Presence REST API and it appears in the avatar row like any user, including indicators visible only to one user via the localOnly flag. Cursors, live selection, and follow mode extend that to what the agent is touching and where it is going.
Away after a configurable inactivity window (default 5 minutes) and immediately when their tab loses focus. Offline after longer inactivity (default 10 minutes) or when their connection drops. Both thresholds are one prop to change.
Yes. locationId scopes the avatar row to a page, tab, or region; allowedElementIds restricts cursors to chosen elements; live selection opts elements in or out with a data attribute.
Cursors work across your document and adapt across screen sizes and content differences, with optional element whitelisting. Live selection tracks inputs, text areas, buttons, and contenteditable elements automatically, and any other element you opt in with one attribute.
One user clicks another’s avatar to start a session (docs call it Follow Me Mode). Whatever the leader does, clicking, scrolling, or navigating, happens on every follower’s screen, with a callback to drive your own router.
Yes. Use the prebuilt components as-is, restyle them with wireframes and template variables, or build fully custom UIs on the presence data hooks, events, and REST APIs. Your avatar row can look nothing like Velt’s defaults.
Yes. The SDK supports React, Next.js, Angular, Vue, and plain HTML via web components, and the Presence REST APIs cover server-side and non-web cases.
Velt is priced on usage, not seats: you pay for documents with review activity in a month, and there is a free tier for development and early production. The presence family is part of the SDK, not a separately priced add-on.
Free tier. No credit card. First comment in 5 minutes.
30 minutes, with an engineer, not a sales deck.
@Jordan Auto-renewal needs 60 days' notice to match our policy, not 30.
@Maya Liability cap is one month of fees — Legal wants 12 months before we sign.
@Maya Governing law should be New York to match the MSA.