Technical diagrams

stacks-technical-diagrams · Design · model-invoked

Architecture, workflow, sequence, data flow and lifecycle diagrams, rendered from typed JSON into one explorable, self-contained HTML file. The largest skill in the set by supporting files: five renderers, six schemas, a delta comparer and four reference documents sit behind one lean SKILL.md, which is progressive disclosure doing its job.

Inside the skill

The sections an agent reads once the skill loads.

• Attribution
• Running the CLI
• Fast authoring path
• Stacks repository workflow
• Type router
• Mermaid input
• Authoring invariants
• Delivery evidence
• Architecture Delta
• Brand marks
• Dependency-free and offline contract
• Deeper references
• Hand-placed fallback (no Bun available)
• Output

Supporting files

Reference, renderers and scripts the skill reaches for on demand, rather than loading up front.

• LICENSE
• THIRD_PARTY_NOTICES.md
• agents/openai.yaml
• assets/template.html
• bin/diagrams
• bin/technical-diagrams.mjs
• bin/preview.mjs
• bin/visual-check.mjs
• brand-marks/README.md
• runtime.toml
• delta/architecture-delta.mjs
• examples
• migrations/workflow-v2.mjs
• recipes/scenarios.mjs
• references/authoring-contract.md
• references/brand-marks.md
• references/delivery-contract.md
• references/viewer-runtime.md
• renderers/architecture
• renderers/dataflow
• renderers/lifecycle
• renderers/sequence
• renderers/shared
• renderers/workflow
• schemas/README.md
• schemas/architecture.schema.json
• schemas/common.schema.json
• schemas/dataflow.schema.json
• schemas/lifecycle.schema.json
• schemas/sequence.schema.json
• schemas/workflow.schema.json
• scripts/check-render-output.mjs
• scripts/render-examples.mjs

Related skills

• Actions
• Cloud
• Database
• Events
• Jobs
• Models
• Realtime
• Router

Using it

This one is model-invoked. Your agent reaches for it on its own when the task matches, and you can also call it by name:

/stacks-technical-diagrams

Source: stacks-technical-diagrams/SKILL.md. Shadow it for one project with app/Skills/stacks-technical-diagrams/SKILL.md, then re-run buddy setup:ai. See Writing your own.