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.

Ir para a instalação

Repositório: bsamiee/Maghz
Última atividade na origem: 19 de julho de 2026 às 01:46
Idioma detectado do SKILL.md: inglês
Estrelas: 0
Forks: 0

Opções de instalação

Por padrão, está selecionado o prompt que primeiro revisa a origem. Você pode mudar para um comando direto ou baixar uma cópia local.

Instalar com Codex ou Claude Copie este prompt, cole no Codex, Claude ou outro assistente e deixe que ele revise a página da skill e instale para você.

Um comando direto ignora o prompt de revisão. Verifique a origem antes de executá-lo.

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

O comando permanece em uma só linha. Role horizontalmente para revisá-lo antes de copiar.

Prefere uma cópia local? Baixe os arquivos disponíveis atualmente no SkillsMP.

Revise os arquivos de origem

Leia o SKILL.md e os arquivos complementares exibidos pelo SkillsMP antes de decidir se vai instalar.

Explorador de arquivos

7 arquivos

SKILL.md

Instruções da origem · Visualização somente leitura

Voltar à pesquisa Voltar à instalação

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

Ver todas deste repositório

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

Informações da origem

Opções de instalação

Revise os arquivos de origem

Mais deste repositório

[HTML_STUDIO]

[01]-[ROUTING]

[02]-[BUILD]

[03]-[CONTRACT]

[04]-[INTEGRATION]

Mais deste repositório

[HTML_STUDIO]

[01]-[ROUTING]

[02]-[BUILD]

[03]-[CONTRACT]

[04]-[INTEGRATION]