React AI Image

Image preview

When your AI generates images—DALL-E, Stable Diffusion, Midjourney API, whatever—you get back base64 data. This component takes that data and renders it properly. It's designed to work directly with Vercel AI SDK's Experimental_GeneratedImage type, so you can just spread the props and it handles the data URL construction, media type, all of it. Nothing fancy, just a clean way to display generated images in your chat without messing around with blob URLs or manual base64 encoding. Responsive by default, rounded corners, ready to drop into any message.

Install with AI

If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this AI component for you — no copy-paste, no CLI:

use shadcnio to install the image AI component into my project

Related Components

FAQ