An agent skill that turns a short JSON spec into animated, explorable diagrams exported as HTML, SVG, PNG, GIF or MP4.
63034JavaScriptMITUpdated yesterday
tt-a1i/archify
An agent skill that turns ideas, plans, or codebases into interactive HTML diagrams, working with Claude Code, Codex, Cursor, and OpenCode.
- Stars
- 84,801
- Forks
- 5,742
- Open issues
- 248
- Last commit
- 23 hours ago
What is it?
Archify is an agent skill that generates interactive diagrams from a text description or from a code repository. You describe a system, flow, or plan to your AI agent, and it produces a self-contained HTML file with clickable nodes, path tracing, and upstream/downstream exploration. It supports architecture, workflow, sequence, data flow, lifecycle, ERD, class, tree, timeline, and waterfall diagrams.
The agent generates a typed JSON source, which bundled validators and layout rules check before the HTML is delivered. When analyzing a repository, nodes can link to source files and line ranges pinned to a specific commit. Output can be exported as PNG, static or motion formats, or share cards, and the HTML file opens in a browser without Archify installed.
Installation uses npx skills add and works with Cursor, Claude Code, Codex CLI, and OpenCode, with additional options for Claude.ai and other agents.
Key features
- 01Generates interactive HTML diagrams from natural-language descriptions.
- 02Analyzes a repository and produces a source-backed architecture map with links to code.
- 03Supports ten diagram types, including architecture, sequence, ERD, and timeline.
- 04Lets you trace upstream and downstream relationships and follow specific routes.
- 05Exports to PNG, motion formats, and share cards.
- 06Validates diagram source before delivery and reports machine-readable errors.
Use cases
- Explaining a system's architecture or request flow to a team from a description.
- Mapping an unfamiliar codebase's components and dependencies for onboarding.
- Visualizing a multi-step plan, such as a travel itinerary or learning path.
- Reviewing design changes by comparing before and after architecture snapshots.
Topics
Summary generated by AI from the project's README. GitHub stats refresh daily.
Related projects
An MCP server that lets AI agents reverse engineer native binaries, JavaScript/Electron apps, .NET assemblies, websites and more, with evidence for each finding.
305.4K77.3KTypeScriptMITUpdated 21 hours ago
A desktop app for managing, syncing and backing up AI agent skills across Claude Code, Codex, Cursor, Copilot, Gemini CLI and dozens of other coding tools.
6.5K525RustMITUpdated 2 days ago
Agent Skills that make coding agents design distinctive frontends with art direction, real photos and in-browser visual checks instead of generic AI landing pages.
98.4K6.7KJavaScriptMITUpdated 4 days ago
A Claude Code and Codex agent skill that builds cinematic product promo videos in Remotion from your own screenshots and copy.
12.3K1.1KTypeScriptApache-2.0Updated 23 hours ago
Structured, verifiable AI-DLC software-delivery workflows that run as steering rules inside AI coding assistants like Claude Code, Kiro, Codex, and Cursor.
5.4K966TypeScriptMIT-0Updated 23 hours ago