Summary

Inline SVG/HTML render tool for chat (like show_widget)

Problem to solve

When OpenClaw generates a diagram (architecture, flow, topology), there's no way to display it inline in chat. The user either sees raw SVG code or has to open an external browser tab (often blocked by HTTP security warnings). This makes technical diagrams nearly useless in conversation. WorkBuddy solves this with a built-in show_widget tool; OpenClaw should have the same capability.

Proposed solution

A built-in tool (e.g. render_svg, show_diagram, or inline_render) that accepts SVG or simple HTML markup as a string argument and renders it as an inline image in the chat.

Proposed behavior:

Agent calls render_svg(svg_code: string) or similar tool
OpenClaw renders the SVG as an inline image in the current conversation
Works across all chat channels (WebChat, Feishu, Discord, Telegram, etc.)
Supports standard SVG features: text, shapes, colors, gradients, arrows, basic CSS
Optionally supports simple HTML for cards/layouts (not full web pages)
The rendered image is part of the message, not a separate URL the user must open
API example:

render_svg(
svg: "..."
)
Backend approach (suggestion):

Server-side headless SVG → PNG/raster conversion (using librsvg, resvg, or similar)
Deliver the rendered image through the existing media/message pipeline
Reuse the MEDIA directive mechanism but automate it via a tool call
Why this approach:

No client-side rendering required (works on any channel)
Reuses existing message delivery infrastructure
Minimal new code — the diagram-maker skill already generates the SVG

Alternatives considered

Canvas plugin + hosted HTML — SVG is saved to canvas directory, user opens browser tab to view. Problem: HTTP security warnings on LAN, extra navigation step, not inline.
SVG → PNG conversion via rsvg-convert + media attach — Works but requires external tool dependency, extra processing step, and produces a static image that can't be interacted with.
Excalidraw format — Editable but opens a separate editor, not inline in chat.
Text-based ASCII diagrams — Works in plain text but ugly, limited, and can't show colors/shapes.
None of these provide the seamless "SVG code → visible image directly in chat" experience that a dedicated inline render tool would.

Impact

Affected users: Any OpenClaw user who wants to share diagrams (architecture, flow, topology) in chat conversations — especially users writing docs, doing ops, or explaining system design.
Severity: Annoying / workflow friction. Not blocking, but forces a workaround every time.
Frequency: Every time a diagram is generated (daily for ops-heavy users). The diagram-maker skill exists but its output can't be shown inline, so every diagram needs a manual workaround.
Consequence: Users either see raw SVG code (unreadable), navigate to an external URL (HTTP warnings), or skip diagrams entirely (poor communication). Extra 30-60 seconds per diagram for the workaround, and the friction discourages using diagrams at all.

Evidence/examples

WorkBuddy's show_widget tool: A built-in tool that accepts SVG or HTML code and renders it as an inline image directly in chat. It demonstrates this is both feasible and valuable.

OpenClaw's existing diagram-maker skill: Already generates high-quality SVG architecture diagrams, but the output can only be viewed as raw code text or through a canvas URL. The rendering pipeline is the missing piece.

OpenClaw's Canvas plugin + MEDIA directive: SVG → PNG conversion via rsvg-convert → attach via MEDIA: path — works but requires extra tooling and manual steps. Screenshot available showing the final image in chat after this workaround, proving the demand exists.

Additional information

N/A. The alternatives and examples above cover the scope.