archify

An agent skill by tt-a1i, from tt-a1i/archify. Tags: design, developer-tools, documents, visual-art, web.

What it does

Create polished, validated architecture, workflow, sequence, data-flow, and lifecycle/state diagrams as explorable standalone HTML with inline SVG, dark/light themes, optional trace motion, and PNG/JPEG/WebP/SVG/WebM export. Accept plain-language requirements or pasted Mermaid flowchart, sequenceDiagram, and stateDiagram input; inspect repository evidence when the diagram must reflect real code. Use when the user asks to visualize system architecture, infrastructure, cloud/security/network topology, technical workflows, API call sequences, request lifecycles, data pipelines, ETL/ELT, data lineage, state machines, or to convert/beautify Mermaid.

Install

With the skills CLI, which installs into Claude Code, Codex, Cursor and other agents:

npx skills add tt-a1i/archify --skill archify

Or copy the skill folder into Claude Code's skills directory by hand (~/.claude/skills for every project, or .claude/skills inside one):

git clone --depth 1 https://github.com/tt-a1i/archify
cp -r archify/archify ~/.claude/skills/archify

Safety box score

Not rated yet. A safety box score grades what a skill and its scripts can reach on the machine of whoever installs it, across eight categories from shell execution to secrets access. Anyone can request one from this page; it is saved for everyone. How the score works.

Source

Repository

tt-a1i/archify (all skills from this repository)

Path

archify/SKILL.md

Branch

main

Updated

2026-09-19

Related skills

• algorithmic-art — js with seeded randomness and interactive parameter exploration.
• customer-journey-map — Create an end-to-end customer journey map with stages, touchpoints, emotions, pain points, and opportunities.
• frontend-design — Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one.
• web-artifacts-builder — ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui).
• stitch::extract-static-html — Extract self-contained static HTML from a built web application or React components by inlining CSS and images.
• api-and-interface-design — Guides stable API and interface design. Use when designing APIs, module boundaries, or any public interface.