Generative Ui

This is the complete Anthropic "Imagine" design system for Claude's show_widget tool, which renders interactive HTML/SVG widgets inline on claude.ai. It's comprehensive: routing tables for picking the right visual type, strict streaming-order rules (styles before HTML before scripts), the full CSS variable spec with dark mode support, Chart.js templates with onload callbacks, and hard constraints like the CDN allowlist and the no-comments rule. If you're building dashboards, diagrams, or interactive explainers in Claude conversations, this gives you the actual design guidelines Anthropic uses internally. The philosophy is clean: flat surfaces, no gradients, semantic colors that adapt to light and dark, and text goes in your response while visuals go in the tool. It's opinionated but thorough.

Install to Claude Code

npx -y skills add himself65/finance-skills --skill generative-ui --agent claude-code