When you download an interactive widget or visual artifact from a Claude chat, the exported HTML file is completely barebones. Without Claude's internal CSS ecosystem and theme engine, diagrams look broken, buttons lose their styling, and layouts collapse.
Worse, relying on the original chat history isn't always safe-returning to an old conversation can frequently result in "Visualization failed to load" errors, locking you out of your generated tools and charts permanently.
Claude Widgets Viewer is a standalone, browser-based environment that perfectly recreates Claude's internal CSS rendering engine. It allows you to drag-and-drop your raw exported widget files and view them exactly as they appeared in the chat.
- Pixel-Perfect Rendering: Automatically injects the necessary structural CSS and theme tokens to make your barebone HTML widgets look flawless.
- 100% Offline & Private: Everything runs locally in your browser. Files are stored entirely in your local IndexedDB database. No telemetry, no external servers, no tracking.
- Responsive Layout: Switch seamlessly between Default (720px), Wide (960px), and Full Width views to test responsive widget behavior.
- Light & Dark Mode: Native support for both themes, perfectly mirroring Claude's official color palettes.
- Fast Search: Instantly filter through your saved widgets and diagrams.
Claude artifacts are raw HTML and JavaScript. While this viewer is 100% offline and private, importing a widget will execute its code in your browser. Only import files from sources you trust.
- Inside a Claude chat, click the Download button on any visual artifact or widget you want to save.
- Open the Claude Widgets Viewer.
- Drag and drop the downloaded
.htmlfile(s) anywhere onto the screen. - Your widget will be safely stored in your browser and will render perfectly every time you need it.
