html-playground
From the author
Use to build interactive single-file HTML playgrounds, explorers, or tools with visual controls, live preview, and prompt copy-out, or to save the current task's findings as an interactive HTML debrief/report.
Install
npx skills add PaulRBerg/agent-skills --skill html-playground -a claude-code
Installs to .claude/skills/html-playground/ · Each command fetches the skill straight from GitHub with the open skills CLI.
Byte-identical to the scanned commit, with the repository’s licence and a SOURCE.txt.
Want your agent to suggest skills while you type? See how to use skills from your IDE.
Safety checks on SKILL.md
- Ships scripts we have not reviewedLow
Why 77
aiqbench computes the trust score from public signals. It is not a security audit, so read a skill before you install it.
Similar skills
Closest to this one by what they do and when they are used.
- playgroundthevibeworks/claude-code-docsCreates interactive HTML playgrounds — self-contained single-file explorers that let users configure something visually through controls, see a live preview, and copy out a prompt. Use when the user asks to make a playground, explorer, or interactive tool for a topic.Other★ 160
- build-dashboardanthropics/knowledge-work-pluginsBuild an interactive HTML dashboard with charts, filters, and tables. Use when creating an executive overview with KPI cards, turning query results into a shareable self-contained report, building a team monitoring snapshot, or needing multiple charts with filters in one browser-openable file.OfficialBrowser★ 32.8K
- visualEricTechPro/super-boardTurn the current work into one polished, self-contained HTML visual page — a recap of a branch's changes, a plan, a map of a folder, endpoint set, or architecture, or an interactive drill-down map of a skill pack or system (zoom, pan, click a node for details, double-click to open its inner view). Use when the user runs /visual or asks to visualise, picture, or visually recap a branch, PR, diff, plan, or part of a codebase, or to map a skill pack, its lanes, scripts, and hooks.Planning★ 489
- interactive-dashboard-builderw95/awesome-claude-corporate-skillsBuild self-contained interactive HTML dashboards with Chart.js, dropdown filters, and professional styling. Use when creating dashboards, building interactive reports, or generating shareable HTML files with charts and filters that work without a server.Other★ 276
- htmlplannotator/effective-htmlCreate or redesign self-contained single-file HTML artifacts with a visual direction shaped by the user's brief, project, and subject. Use when HTML is the deliverable for a report, explainer, landing page, presentation, tool, mixed artifact, or broad request. This is the collection's only implicit router. Route clear wireframe, prototype, mockup, plan, or diagram requests to the matching direct-invocation specialist when available. Do not use for ordinary application implementation when a standalone HTML file is not the deliverable.Design★ 3.8K
- render-workspace-htmlShaishavMaisuria/research-paper-lifecycle-skillsRenders the paper-workspace (outputs + lifecycle progress) into a single self-contained HTML dashboard the author can open in a browser, and refreshes it on request. Use when a researcher says "show me an HTML view", "give me a dashboard", "can I see my progress in a browser", "visualize what's been done", "make an HTML report", or "update the dashboard". Offered as an option whenever a visual overview would help (it is opt-in, not generated unprompted), and re-run after each significant change so the page stays current. The output is one local dashboard.html with inline CSS — no network, no external assets, light/dark aware — listing every generated artifact by stage with clickable links and a recent-activity timeline. Trigger words - html, dashboard, browser view, visualize progress, html report, update the html.Media★ 55
Ratings & reviews
—
no reviews
Tried this skill? Rate it to help others. Sign in
Discussion
Join the discussion. Sign in