Inline Visualizer: Local AI Models Can Now Render Interactive HTML Visualizations

Inline Visualizer is a plugin for Open WebUI that gives local AI models the ability to render interactive HTML/SVG visualizations directly in chat, with two-way communication between visual elements and the AI model.

What It Does

The plugin provides models with a design system and rendering tool. Models write HTML/SVG fragments, which the tool wraps in a themed shell with dark mode support, rendering them inline in chat. A JavaScript bridge allows elements inside visualizations to send messages back to the chat interface.

Key Features

• Works with any model that supports tool calling: Qwen, Mistral, Gemma, DeepSeek, Gemini, Claude, GPT
• BSD-3 licensed - fork, modify, use as you want
• No iframes-within-iframes, no external services, no API keys required
• Interactive elements can send messages back to the AI model

Example Use Cases

• Architecture diagrams where clicking a node asks the AI about that component
• Chart.js dashboards with proper dark/light mode theming
• Interactive quizzes where the AI grades your answers
• Preference forms that collect choices and send them to the model
• Explainers with expandable sections and hover effects
• Literally any HTML/SVG/JS the model can write

Requirements

• Open WebUI (self-hosted)
• Any model with tool calling support
• Less than 1 minute to paste two files and follow installation setup

Performance Considerations

The creator notes that performance depends on your model's tokens per second (TPS). With single digit TPS, you might wait about a minute for rendered artifacts to appear. The demo uses Claude Haiku for speed, but the tool has been tested with Qwen3.5 27b (slower but functional).

Installation

The plugin (tool + skill) is available at https://github.com/Classic298/open-webui-plugins. Installation tutorial is in the plugin's folder README.