archify

Generate validated architecture, workflow, sequence, dataflow, and lifecycle diagrams as interactive HTML from JSON specifications.

Updated Sep 11, 2026
One-click install
npx skills add https://github.com/CYRUS-pinto/pi-bot --skill archify-cyrus-pinto
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: archify
Source: https://github.com/CYRUS-pinto/pi-bot/tree/main/.agents/skills/archify
Command: npx skills add https://github.com/CYRUS-pinto/pi-bot --skill archify-cyrus-pinto

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires ajv, parse5, saxes, simple-icons, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve? Creating polished technical diagrams by hand is slow and error-prone, and Mermaid output often lacks layout control, validation, and export quality. Archify turns plain-language requirements or pasted Mermaid into validated, self-contained interactive HTML diagrams with deterministic receipts. ## Core Features & Use Cases - Five typed diagram renderers: architecture, workflow, sequence, dataflow, and lifecycle, each driven by a strict JSON schema with showcase-quality validation. - Mermaid conversion: Accepts flowchart, sequenceDiagram, and stateDiagram input and re-authors it as fresh Archify JSON rather than mechanically copying Mermaid styling. - Deterministic delivery and verification: The deliver command freezes the specification, renders it, and reports SHA-256 receipts; visual-check collects browser evidence from the delivered HTML. - Use Case: Ask for a diagram of your microservices deployment with security boundaries, and receive a validated standalone HTML file with dark/light themes, pan/zoom, search, and PNG/SVG/WebM export. ## Quick Start Ask the assistant to create an architecture diagram of your system from a plain-language description or pasted Mermaid, and it will author, validate, and deliver a standalone interactive HTML file.

Frequently Asked Questions about archify

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create an architecture diagram from a text description?

Describe your system in plain language and Archify authors a typed JSON specification, validates it against the architecture schema, and renders a standalone interactive HTML file. Run node bin/archify.mjs validate then deliver to get a checked artifact with a SHA-256 receipt.

Can I convert Mermaid diagrams to interactive HTML?

Yes, Archify accepts pasted Mermaid flowchart, sequenceDiagram, and stateDiagram input. It reads the Mermaid for topology and meaning, then authors fresh Archify JSON mapped to workflow, sequence, or lifecycle types rather than copying Mermaid styling.

What diagram types does Archify support?

Archify supports five typed renderers: architecture for components and boundaries, workflow for processes and approval gates, sequence for API call chains, dataflow for pipelines and lineage, and lifecycle for state transitions. Each has its own JSON schema and validator.

Does Archify require npm install or network access to run?

No install is required inside the skill package; validators are pre-generated and committed, so runtime validation has no npm or network dependency. Verify the setup with node bin/archify.mjs doctor or run the demo command.

Why does Archify validation fail on my diagram JSON?

Validation fails on schema shape errors like unknown fields, wrong enums, or missing required arrays, and on composition errors like label collisions or edge crossings. Fix the diagnosed subject using the reported supportedFixes and rerun validate until the showcase checks pass.

What export formats can the generated HTML viewer produce?

The generated standalone HTML viewer supports PNG, JPEG, WebP, SVG, and WebM export, along with dark and light themes, pan/zoom, search, focus, and optional trace animation. Exports are reader capabilities built into every delivered artifact.