explaingit

tt-a1i/archify

Analysis updated 2026-05-18

6,925HTMLAudience · developerComplexity · 2/5LicenseSetup · easy

TLDR

An AI agent skill that turns a plain-English system description into an interactive, shareable architecture, workflow, sequence, data-flow, or lifecycle diagram.

Mindmap

mindmap
  root((repo))
    What it does
      Text to diagram
      Five diagram types
      Interactive HTML output
    Tech stack
      HTML and JSON schema
      Claude Codex opencode skill
    Use cases
      Document system architecture
      Explain a login or API flow
      Trace data lineage
    Audience
      Developers
      PM and founders

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Ask your AI coding agent to map a repository's runtime architecture as a shareable diagram.

USE CASE 2

Turn a described login or API flow into an interactive sequence diagram.

USE CASE 3

Trace how data moves through a pipeline and where sensitive data is exposed.

USE CASE 4

Produce a presentation-ready architecture diagram for stakeholders without a design tool.

What is it built with?

HTMLJSONNode.js

How does it compare?

tt-a1i/archifyjgraph/mxgraphmailgun/transactional-email-templates
Stars6,9256,9236,937
LanguageHTMLHTMLHTML
Setup difficultyeasymoderateeasy
Complexity2/53/51/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

Installed via a single npx command as a skill for an existing AI coding agent.

Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

In plain English

Archify is a skill that an AI coding agent, such as Claude, Codex CLI, or opencode, can use to turn a plain-English description of a system into a polished diagram. Instead of drawing a rough sketch, it produces a single, self-contained HTML file that you can open in a browser, click around in, and share. You describe what you want, for example a login flow that goes from a browser through a web app, an API, token checking, a cache lookup, and a database fallback, and the agent uses Archify to lay it out. It supports five kinds of technical diagrams: architecture diagrams for showing components and services, workflow diagrams for processes like approvals or CI/CD pipelines, sequence diagrams for showing calls and responses over time, data flow diagrams for tracing how information moves and where it is sensitive, and lifecycle diagrams for showing states, retries, and outcomes. The finished diagrams are interactive rather than static pictures. A viewer can search for a specific part of the system, trace a particular path through it, compare how busy different parts are, or watch a short guided walkthrough, all without the tool inventing connections that were not actually described. Diagrams come in light or dark themes and can include gentle animation. They can be exported as PNG, SVG, animated WebM video, or a ready-to-share image sized for social posts. Under the hood, each diagram is generated from a structured, typed data format with a schema, and the tool runs automatic checks on layout, formatting, and routing before it will replace a working diagram with a new one, so a broken save does not overwrite something that already works. The project describes itself as a way to turn a technical idea into something you can present, not as a general drawing editor or a themed version of existing diagramming tools. It installs as an add-on for supported AI coding agents with a single command line install, and once installed you simply ask your agent in plain language to use Archify on your repository or on a description you give it. The project is released under the MIT license, so it can be used, modified, and redistributed freely, including for commercial purposes, as long as the copyright notice is kept.

Copy-paste prompts

Prompt 1
Analyze this repository, then use archify to create a high-level runtime architecture diagram with 8 to 12 core components.
Prompt 2
Use archify to draw this login flow: Browser to Web App to API to JWT validation to Redis to PostgreSQL fallback.
Prompt 3
Use archify to build a data flow diagram showing where personal data enters and where it is stored.
Prompt 4
Ask archify to create a lifecycle diagram for this order's states, including retries and cancellation.

Frequently asked questions

What is archify?

An AI agent skill that turns a plain-English system description into an interactive, shareable architecture, workflow, sequence, data-flow, or lifecycle diagram.

What language is archify written in?

Mainly HTML. The stack also includes HTML, JSON, Node.js.

What license does archify use?

Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

How hard is archify to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is archify for?

Mainly developer.

Open on GitHub → Explain another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.