TokElements

Integrations

Connect TokElements to Claude or ChatGPT

TokElements builds live overlays for TikTok LIVE: sandboxed HTML widgets that react to gifts, follows, subscriptions, chat and everything else the platform sends, shown through one browser source in OBS. This connector puts that in front of an assistant, so you can describe a widget instead of writing it — and watch the result run before it ever reaches your stream.

Server URL

One address, both platforms. It speaks the Model Context Protocol over HTTPS and authenticates with OAuth 2.1, so you sign in to TokElements yourself and grant access explicitly; nothing is shared with an assistant until you do.

https://tokelements.com/api/mcp

What it can do

Write a widget by describing it

The assistant writes the html, css and js, creates the widget in your account and shows you a live preview of it reacting to sample events. It reads the full SDK reference first, so the code uses real triggers rather than invented ones.

Start from the catalogue

Browse the shipped templates and the community ones, install any of them as your own editable copy, and change it from there.

Put it on the overlay

See what is on your overlay right now, place a widget on it, move or resize it, change its streamer settings, take it off again.

Ask for the files it needs

A widget that wants a sound or an image gets an upload link you open yourself. The assistant never moves files into your account — it asks, waits, and picks them up once you confirm.

What it can reach

A connection covers the widgets, overlays and asset library of the one account that authorised it, and nothing else. There is a single permission and it does not reach past your account: not your TikTok password — TokElements never has one — not your viewers’ personal data, and not anybody else’s account or the shipped catalogue.

Every tool that changes something says so before it runs, and destructive ones are marked as destructive, so your assistant can ask before deleting a widget rather than after.

Set it up in Claude

  1. Open Settings → Connectors in Claude and choose “Add custom connector”.
  2. Paste https://tokelements.com/api/mcp as the server URL.
  3. Claude opens a TokElements sign-in and asks which permissions to grant. Approve, and the tools appear in your conversations.

Set it up in ChatGPT

  1. Open Settings → Connectors (or Apps) in ChatGPT and add a connector.
  2. Paste https://tokelements.com/api/mcp as the MCP server URL.
  3. Sign in with TokElements when prompted. Widget results render inline, with a preview you can watch react to sample events.

Without an assistant

The same tools are available to your own scripts with a personal token from the studio, and the widget SDK is documented in full at /docs. Machine-readable summaries of the product live at /llms.txt and /llms-full.txt.

Support

Questions, or something the connector does that it should not: [email protected]. What we store and why is in the Privacy Policy; the agreement is in the Terms of Service.