Skip to main content
Generative UI lets the LLM compose rich interfaces on the fly using json-render and 36 pre-built shadcn/ui components. The AI generates a json-render spec, the server validates it against the component catalog, and the widget renders it instantly. Generative UI showcase

Try the demo

Launch the live widget experience.

View source on GitHub

Browse the full example code.

How it works

The MCP server builds a json-render catalog from @json-render/shadcn and embeds the auto-generated component documentation in the render tool description. When the LLM calls the tool, it passes a { root, elements } spec as input. The server validates the spec against the catalog, auto-fixes common mistakes, and returns it to the widget as structured content. The widget renders the spec with @json-render/react’s Renderer and JSONUIProvider, using the pre-built shadcn component registry.

Skybridge APIs used

Third-party integrations