Agents
AI Paywall Builder
Build, refine, and debug paywalls by describing what you want. AI Chat lives in the editor, and Editor MCP lets Claude Code, Codex, or Cursor edit the paywall open in your browser.
The paywall editor has a chat in its sidebar. Type "create a three-plan product selector with annual highlighted" and it builds one, wired to your products. Type "find why the restore button looks off-center on small devices and fix it" and it inspects the layout tree, looks at a screenshot, and fixes it. The AI Chat Builder works through the same editor tools you use by hand, so every change lands in the draft, shows up in History, and can be undone.
What the chat can change
Most of what you can edit manually, the chat can edit for you. It reads the editor state, the layout tree, and screenshots, and it can make several tool calls in one response while you watch the canvas update.
-
Design. Layout, element hierarchy, names, text, styles, ordering, images, and videos. Ask it to inspect computed styles when a visual result needs polish.
-
Data. Products and product references, theme tokens, style modes, variables, current and initial values, and dynamic values, so a generated design stays connected to the products it sells.
-
Behavior. Tap behaviors, purchase actions, navigation, haptics, animations, routes, transitions, branching, localization, and trial-started notifications. Find and replace covers changes that touch many elements at once.
Select one or more elements on the canvas before you send a message and they go along as context. Paste or drag in a JPEG, PNG, GIF, or WebP when you want the result to match a reference or a competitor's screen.
Bring your own agent
If you would rather stay in Claude Code, Codex, or Cursor, Editor MCP attaches that agent to the paywall open in your browser. Click the connection pill in AI Chat, pick Skill or MCP, and paste the generated prompt with its pairing code into your agent. The agent receives the editor's live tool list and can do everything the built-in chat can, including writing native paywall HTML straight into the editor. One controller at a time. Pairing codes expire after 10 minutes and a browser session lasts 24 hours.
Connect an agent to the editorAccount setup is a different tool
The editor chat is for the paywall in front of you. For creating applications, campaigns, products, and webhooks from an AI tool, use the Superwall MCP, which manages account resources over the Model Context Protocol, or the Agent Skills, which add live docs and SDK integration guidance on top. Together they take an app from empty project to live paywall without opening the dashboard.
What you can do with it
- Turn a Figma screenshot into an editable paywall that already sells your products.
- Ask for "a short trust row under the CTA" and get one in your theme tokens.
- Add a localized language and let the chat run AI localization across the paywall.
- Diagnose why a purchase button does nothing, from the chat, with the editor state as evidence.
Get started
Open any paywall in the
Paywall Editor and click AI Chat
in the sidebar. The starter prompts are a good first message. To use your
own agent, install the skill with npx skills add superwall/skills
and paste the pairing prompt from the connection panel.