12k

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

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

React PDF

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

ReactPDF

React Three Fiber

3D scenes generated from json-render specs using Three.js and React Three Fiber.

React3D

React Native

Mobile app rendering json-render specs with Expo and React Native.

React NativeExpo

Remotion

Generate videos from json-render specs using Remotion.

ReactVideo

Image

Generate OG images and social cards from json-render specs using Satori.

ReactImage

MCP App

MCP server that serves shadcn UIs to Claude, ChatGPT, Cursor, and VS Code.

ReactMCPVite