Creates 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.
Collected from public GitHub. Every version is saved exactly as it was and never changes. Install it at an exact version with the mdr tool, and every file is checked before it reaches your agent. The main file is checked against the SHA-256 fingerprint recorded here, and the others against the fingerprints GitHub keeps for its source commit. The automatic checks below grade the latest version, and the same checks always give the same file the same grade.
What the file says
# Playground Builder
A playground is a self-contained HTML file with interactive controls on one side, a live preview on the other, and a prompt output at the bottom with a copy button. The user adjusts controls, explores visually, then copies the generated prompt back into Claude.
## When to use this skill
When the user asks for an interactive playground, explorer, or visual tool for a topic — especially when the input space is large, visual, or structural and hard to express as plain text.
## How to use this skill
1. **Identify the playground type** from the user's request
2. **Load the matching template** from `templates/`:
- `templates/design-playground.md` — Visual design decisions (components, layouts, spacing, color, typography)
- `templates/data-explorer.md` — Data and query building (SQL, APIs, pipelines, regex)
- `templates/concept-map.md` — Learning and exploration (concept maps, knowledge gaps, scope mapping)
- `templates/document-critique.md` — Document review (suggestions with approve/reject/comment workflow)
- `templates/diff-review.md` — Code review (git diffs, commits, PRs with line-by-line commenting)
…
The line at the top of this page pins the label git:20260610.c645100, which is what most people want. This one pins the sha256 fingerprint of the contents instead, so it survives a label being moved. Either way the exact version is written to mdr.lock, and mdr install downloads and checks those contents again, so it installs them exactly or stops with an error.
GET https://markdownregistry.com/api/v1/artifacts/art_j2mx3oeqizgy3qmg
GET https://markdownregistry.com/api/v1/resolve?ref=nota-america/forgecat-agent-profiles/playground
GET https://markdownregistry.com/api/v1/blob/521a3d62211e5f47b65ed17b660e001b15cf8d88d058cbf31bc00e889bcb63cc
Your AI assistant does the legwork. You hear about the deals worth your word. Hand yours the standing instructions at modelranch.com and it joins the network that reads files like this one.
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/api-and-interface-design/SKILL.md · Guides stable API and interface design. Use when designing APIs,
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/browser-testing-with-devtools/SKILL.md · Tests in real browsers via Chrome DevTools MCP. Use when building
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/ci-cd-and-automation/SKILL.md · Automates CI/CD pipeline setup. Use when setting up or modifying
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/code-review-and-quality/SKILL.md · Conducts multi-axis code review. Use before merging any change. Use
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/code-simplification/SKILL.md · Simplifies code for clarity. Use when refactoring code for clarity
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/constraint-driven-development/SKILL.md · Establishes a project's quality bar as a written contract and stops
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/context-engineering/SKILL.md · Optimizes agent context setup. Use when starting a new session,
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/deprecation-and-migration/SKILL.md · Manages deprecation and migration. Use when removing old systems,
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/documentation-and-adrs/SKILL.md · Records decisions and documentation. Use when you need to document
nota-america/forgecat-agent-profiles · profiles/addyosmani/agent-skills/for-claude/.claude/skills/doubt-driven-development/SKILL.md · Subjects every non-trivial decision to a fresh-context adversarial
sandbaseai/sandbase-skills · marketing/playground/SKILL.md · Create, implement, or review playground work with format, accessibility, performance, and visual-verification controls…
wellwelwel/lagune · .claude/skills/playground/SKILL.md · Mounts an agent against this tree's build in an isolated home and a fresh fixture, then measures it, probes it, or adds…