📊
FrontendTypeScript

Inline Visualizations

by get-bb

Inline Visualizations is a Frontend skill for Claude Code, published by get-bb in bb.

2.3K stars253 forkson get-bb/bbAdded 2026/08/18+27% in starsRepository updated 2026/08/18
adeagent-ideclaude-codecodexdevtoolside
Install in seconds
Install Inline Visualizations
Copy Inline Visualizations into your Claude Code skills folder. Run the command in your terminal, or review the source on GitHub before installing.
terminal
npx degit https://github.com/get-bb/bb/tree/main/plugins/inline-vis/skills/inline-vis ~/.claude/skills/inline-vis

Requires Node.js. Downloads this skill only — not the rest of the repository — into your Claude Code skills folder.

Without Node.js

git clone https://github.com/get-bb/bb.git

Clones the whole repository, then copy the skill’s own directory into your skills folder yourself.

In this catalog

Source file
plugins/inline-vis/skills/inline-vis/SKILL.md in get-bb/bb
Installs to
~/.claude/skills/inline-vis
Collection
One of 14 skills cataloged from this repository
Category
Frontend567 skills

What Inline Visualizations does

Inline Visualizations emits a sandboxed inline HTML preview in an assistant message when a workspace .html file should render in-thread. Use after writing or updating a demo, chart, or report HTML file the user should see without opening a panel.

Inline Visualizations is cataloged under Frontend on DirSkills. Inline Visualizations comes from a repository tagged ade, agent-ide, claude-code, codex and devtools.

Documentation

README

Inline HTML visualizations

When the user should see a small HTML demo, chart, or report inline in the assistant message, write (or update) a workspace-relative .html file, then emit this message directive as its own block (not inside a fenced code block):

::inline-vis{file="demo.html"}

Rules

This is the opening of the README. Read the full README on GitHub.

Frequently asked about Inline Visualizations

  • What else does get-bb publish alongside Inline Visualizations?

    Inline Visualizations is one of 14 skills that DirSkills catalogs from get-bb/bb, the repository it ships in. Its siblings there include Automations, BB Plugin Authoring and Bb Cli. Each one is a separate skill with its own page in this directory, installs the same way Inline Visualizations does, and is maintained by get-bb in that same repository. The rest of the collection is listed on the get-bb/bb page.

  • How does Inline Visualizations compare to other Frontend skills?

    Inline Visualizations ranks #232 by stars among the 567 Frontend skills in this catalog. The most-starred ones next to it are Angular Developer, Android Clean Architecture and Accessibility. DirSkills ranks by the star count of the repository each skill ships in, so that order reflects how popular those repositories are rather than any review of Inline Visualizations against them. Open each page to compare what they document and how they install.

More from get-bb/bb

Inline Visualizations is one of 14 skills cataloged on DirSkills from get-bb/bb.

See all 14 skills
2w ago

Automations

Automations creates and manages scheduled tasks for bb that run either agent prompts or server-side scripts. Use it to schedule recurring or one-shot work with bb automation commands.
Automation
2.3K253
🧩
2w ago

BB Plugin Authoring

BB Plugin Authoring covers writing, building, and installing bb plugins, from scaffolding a new plugin to extending bb with CLI commands, agent tools, background services, settings, panels, mention providers, and other surfaces. Use it whenever the task is to create a bb plugin, extend bb itself, or add a bb surface via a plugin.
AI Engineering
2.3K253
🛠️
2w ago

Bb Cli

Bb Cli controls bb itself to inspect status, manage threads and automations, and work with projects, providers, and environments. Use it when an agent needs to coordinate or configure a bb workspace.
Automation
2.3K253
📝
2w ago

CLI Guide and Skill

CLI Guide and Skill keeps the bb CLI guide templates, built-in bb-cli skill, and configuration documentation in sync whenever a CLI command, flag, or config knob changes.
Writing
2.3K253
📄
2w ago

Docs

Docs accesses and updates the user's document vaults, letting the agent read, find, create, update, or store notes, documents, plans, and HTML artifacts. Use it when the user asks to manage documents or when a Docs @-mention appears.
Writing
2.3K253
🧠
2w ago

Memory

Memory stores durable project knowledge and cross-project user preferences so an agent can recall them in future threads. Use it to retrieve relevant memories progressively and save verified, reusable learnings via the bb memory CLI.
AI Engineering
2.3K253