html-studio

Author single-file, self-contained interactive HTML artifacts — reports, dashboards, roadmaps, plans, decision docs, and their variants (diff-reviews, quizzes, wargames, buy-in packets, boards, decks, explainers, atlases) — as typed deliverable compositions under one design system, then validated headless (`gate`, `render`) and optionally served with a return channel (`serve`, `receipts`) that brings the reader's judgment back as data. Use when a plan, roadmap, comparison, decision, dataset, or architecture reads better as an interactive page than markdown, when a page should return the user's adjustments as data, or when the user says HTML plan, roadmap, dashboard, deck, wargame, quiz, or report. Distinct from the Artifact tool's hosted fragments; mermaid fences belong to mermaid-diagramming.

跳到安装

仓库: bsamiee/Maghz
最近来源活动: 2026年7月19日 01:46
检测到的 SKILL.md 语言: 英语
星标: 0
分支: 0

安装方式

默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。

用 Codex 或 Claude 帮你安装复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。

直接命令不会经过审查 Prompt；运行前请先检查来源。

npx skills add https://github.com/bsamiee/Maghz --skill html-studio

命令会保持在同一行。复制前请横向滚动并检查完整内容。

想先保存到本地？可下载 SkillsMP 当前能够提供的文件。

检查来源文件

决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。

文件资源管理器

7 个文件

SKILL.md

来源说明 · 只读预览

返回搜索返回安装

docgen

Owns all prose, markdown files and the comments inside source files and fences through a register law, an anti-anchoring rule against rosters, counts, and freezes, a named defect catalog, file-kind templates, and a deterministic gate and fixer. Use when authoring, editing, reviewing, or markdown files of any kind, and comments in source files; when designing a document schema or marker vocabulary; when pruning code comments; or on "clean up this doc", "tighten the prose", "this doc is stale".

2026-07-23

agent-dispatch

Owns work placement and delegation craft across Claude Code's execution surfaces — main turn, `/btw`, fork, subagent, background task, nested subagent, agent team, dynamic workflow — with the selection economics that pick one, the delegation contract that makes a worker prompt self-contained (objective, territory, output contract, receipt), the communication topologies (star, pipeline, panel, tournament, generate-filter, loop), depth and fan-out budgeting, and the runtime mechanics of background permission surfacing, `SendMessage` resume, and worker memory. Use when parallelizing work, delegating a task to a subagent or teammate, choosing between a subagent, fork, team, or workflow, writing a `.claude/agents/` definition, designing a fan-out or review pipeline, or when a delegation stalls, over-prompts for permission, or returns weak results. Authoring runnable workflow scripts belongs to workflow-creator; gpt-5.6 offload belongs to the codex skill and Gemini offload to agy; harness configuration belongs to h

2026-07-19

agy

Bounded one-shot Gemini sub-calls through the Antigravity CLI (`agy`): multimodal judgment over screenshots, generated images, UI states, and diagrams, read-only adversarial review lanes that return typed falsifiable findings as a second-model perspective, Nano Banana image generation and edit iteration feeding html-studio and mermaid work, broad synthesis across competing designs, ambiguity reduction into crisp constraints, alternate approaches and counterexample hunts, and redacted log or dataset distillation. Use when a task gains from an external second model, a critique or red-team stage wants an independent Gemini lens, or the request names Gemini, Antigravity, Google Ultra, or Nano Banana. gpt-5.6 offload belongs to the codex skill; delegation across Claude's own surfaces belongs to agent-dispatch.

2026-07-19

查看这个仓库的全部 Skills

name	html-studio
description	Author single-file, self-contained interactive HTML artifacts — reports, dashboards, roadmaps, plans, decision docs, and their variants (diff-reviews, quizzes, wargames, buy-in packets, boards, decks, explainers, atlases) — as typed deliverable compositions under one design system, then validated headless (`gate`, `render`) and optionally served with a return channel (`serve`, `receipts`) that brings the reader's judgment back as data. Use when a plan, roadmap, comparison, decision, dataset, or architecture reads better as an interactive page than markdown, when a page should return the user's adjustments as data, or when the user says HTML plan, roadmap, dashboard, deck, wargame, quiz, or report. Distinct from the Artifact tool's hosted fragments; mermaid fences belong to mermaid-diagramming.
allowed-tools	["Bash(uv run ${CLAUDE_SKILL_DIR}/scripts/studio.py *)"]

[HTML_STUDIO]

Every artifact is one self-contained file: a deliverable type fixes its composition — layout class, structural spine, element set, capture contract — and the references rule the code, style, figures, and interaction it composes from.

[01]-[ROUTING]

[REFERENCES]:

[01]-DELIVERABLES: registers each type — spine, layout class, element set, capture contract, variant-to-core table
[02]-HTML: advanced HTML — semantic structure, density, and the coding patterns every artifact composes from.
[03]-SVG: advanced inline SVG for HTML — the element vocabulary, construction patterns, and figure and diagram craft.
[04]-STYLE: rules the design language — token system, layout, theming, and the legibility law every artifact inherits
[05]-INTERACTION: rules the return channel — data-to-presentation mapping, the drawer, adjustments returned as data

[02]-[BUILD]

Load the references.
Select the deliverable type by the reader's first question; it fixes measure, spine, envelope, and drawer. A two-type page splits or subordinates.
Model content before rendering: the payload block carries every fact and stable ids on each capturable item; markup states nothing the model lacks.
Compose answer-first down the spine: real controls, data rows, and rendered rivals inherit the token registry, never prose over an unbuilt surface.
Run uv run ${CLAUDE_SKILL_DIR}/scripts/studio.py gate <file.html> until clean: self-containment, accessibility, style doctrine, W3C markup.
render <file.html> returns a headless screenshot and the console through the machine's pinned Chromium; --help lists every verb.
An artifact whose value is the user's judgment runs served: serve <file.html> hosts the return channel, receipts <file.html> reads submissions.

[03]-[CONTRACT]

One file: <!doctype html>, one <title>, all CSS in one <style>, one executable <script>, optional inert application/json payloads.
Zero external references — no CDN, webfont, or remote image; only in-page anchors, data: URIs, sibling-artifact links, and injected return metas.
Dark and light both render; wide content scrolls inside its own container and the body never scrolls sideways.
Injected source, diff, and answer text reaches the DOM through escaping before any span wraps it; embedded JSON payloads are sanitized on embed.

[04]-[INTEGRATION]

A durable artifact homes at docs/atlas/ as <kind>.<scope>[.<slug>].html; a session artifact stays in scratch and never commits.
Chart marks and palettes defer to the dataviz skill.
Mermaid fences defer to mermaid-diagramming, whose render lane delivers a mermaid-sourced figure as pre-rendered inline SVG the page hosts.
Interview method, kind contracts, and the durable-versus-ephemeral ruling defer to the interviewing skill.

html-studio

来源信息

安装方式

检查来源文件

同仓库更多 Skills

同仓库更多 Skills

[HTML_STUDIO]

[01]-[ROUTING]

[02]-[BUILD]

[03]-[CONTRACT]

[04]-[INTEGRATION]

[HTML_STUDIO]

[01]-[ROUTING]

[02]-[BUILD]

[03]-[CONTRACT]

[04]-[INTEGRATION]