Agent-aware web components.
Forms your AI can fill.
Framework-agnostic custom elements with Standard Schema validation and first-class WebMCP exposure — so the same control a person types into, an agent can drive.
Drops into anything that renders HTML
One element.A human control and an agent tool.
Drop in an element
Add <wmcp-input> to any page. It is a proper, accessible, form-associated control first.
Opt into exposure
Add the `expose` attribute. The element registers a WebMCP tool on connect, removes it on disconnect.
Agents fill the form
A WebMCP-aware agent discovers the tool and sets the value — validated, announced, and submitted like a human.
Built as a form library.Agent-ready on purpose.
Framework-agnostic
Standard custom elements built with Lit. Drop them into React, Vue, Svelte, or plain HTML — no wrapper required.
Standard Schema validation
Bring Zod, Valibot, or ArkType. Validation drives aria-invalid, live error messages, and native form constraints.
WebMCP exposure
Opt in with `expose` and each control registers an imperative WebMCP tool an agent can call — feature-detected, zero-cost when absent.
No-build CDN
One script tag auto-registers every element. Perfect for Webflow, WordPress, or hand-written HTML.
Design tokens
Theming via CSS custom properties from a Style Dictionary pipeline — light and dark out of the box.
Accessible by default
Real form association through ElementInternals: labels, error live regions, and form participation come built in.
Add it in one line.
Use the ESM package with your build tool, or drop a single script tag — no build step required.
pnpm add @webmcpui/core @webmcpui/tokens