Examples

Explore json-render across frameworks, renderers, and use cases.

Chat

AI chat app with tool calling, streaming UI, and rich components powered by the AI SDK.

ReactNext.jsAI

eve TanStack Agent

Web chat built on eve and TanStack Start, where the agent replies with result cards, metrics, and tables.

ReactTanStack StartAI

Dashboard

AI-generated dashboard with drag-and-drop, charts, and real-time data binding.

ReactNext.jsAI

No AI

Static specs rendered without any AI — forms, cards, tables, and more from hardcoded JSON.

ReactNext.js

Svelte

Svelte renderer demo with counter, todo list, and two-way data binding.

SvelteVite

Svelte Chat

AI chat app built with SvelteKit and the Svelte renderer.

SvelteSvelteKitAI

Vue

Vue renderer demo with counter, todo list, and two-way data binding.

VueVite

Solid

Solid renderer demo with counter, todo list, and two-way data binding.

SolidVite

Multi-Framework Renderers

Same spec rendered with React, Vue, Svelte, and Solid side by side — hot-swappable at runtime.

ReactVueSvelteSolidVite

React Email

Generate HTML and plain-text emails from json-render specs using React Email.

ReactEmail

Chat SDK

Generate native Slack, Teams, and Discord cards from json-render specs with Chat SDK, with a Slack preview.

ReactNext.jsChat SDK

React PDF

Generate PDF documents from json-render specs with @react-pdf/renderer.

ReactPDF