reactive html plots
Ask your AI agent for a chart
rhp uses CSS and JavaScript to build charts. The rhp skill and MCP server give your agent the guide, 30 recipes and a browser checker. The checker returns screenshots and fixes the agent can use before handing over the chart. Give no style and you get an original poster designed for its subject, with an interaction that fits.
Build with AI
In a coding agent
Claude Code, Codex, Cursor, Copilot, Gemini CLI and more
npx skills add bezda-team/rhpThen ask for a chart:
Make a chart of the world’s ten largest cities.
In a chat app
ChatGPT, Claude, Gemini
Make this chart with rhp (@bezda/rhp). First read https://rhp.vercel.app/llms-full.txt and follow it: rhp 2 is newer than your training data. Give me one HTML file that I can open in a browser. The chart I want:Paste the prompt, then describe your chart after it.
With MCP tools
Apps that support local MCP servers
Give your agent the guide, references, 30 recipes and browser checker as tools, with screenshots it can inspect. Use the MCP server on its own or alongside the skill.
claude mcp add rhp -- npx -y @bezda/rhp-mcpRun this in your project’s folder to add rhp to that project.
codex mcp add rhp -- npx -y @bezda/rhp-mcpRun in your terminal, then start a new Codex session.
gemini mcp add --scope user rhp npx -- -y @bezda/rhp-mcpRun in your terminal to add rhp for all your projects.
copilot mcp add rhp -- npx -y @bezda/rhp-mcpRun in your terminal, then start a new Copilot CLI session.
code --add-mcp "{\"name\":\"rhp\",\"command\":\"npx\",\"args\":[\"-y\",\"@bezda/rhp-mcp\"]}"Run in your terminal to add rhp to your VS Code user profile.
{
"mcpServers": {
"rhp": {
"command": "npx",
"args": [
"-y",
"@bezda/rhp-mcp"
]
}
}
}In Settings > Developer > Edit Config, merge this into claude_desktop_config.json, then fully restart Claude.
{
"mcpServers": {
"rhp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@bezda/rhp-mcp"
]
}
}
}Merge this into ~/.cursor/mcp.json for all projects, or .cursor/mcp.json for one project.
{
"mcpServers": {
"rhp": {
"command": "npx",
"args": [
"-y",
"@bezda/rhp-mcp"
]
}
}
}In Cascade’s MCP panel, choose Open MCP config file and merge this server into the config.
{
"context_servers": {
"rhp": {
"command": "npx",
"args": [
"-y",
"@bezda/rhp-mcp"
],
"env": {}
}
}
}Open the command palette, run “zed: open settings file”, and merge this into your settings.
What your agent does, the 30 recipes, and more ways to set it up