Hey there, it's Adela 👋 Welcome to Star History!
Each month, we bring you the standout highlights from the open-source world ✨
Follow @StarHistoryHQ for daily GitHub gems!

Ask an AI agent to draw how your software fits together and you get a diagram in seconds. It has boxes, arrows and labels, and it is roughly correct. You still won't put it in your blog post.
The model wrote that diagram as text and never saw the picture. Videos and app screens come out the same way. Hand a model a blank canvas and it fills it with something average.
This month's four projects take the blank canvas away. Each gives the model a form to fill in, in a text format it already writes well, and each has its own way of keeping the result honest: a rulebook, an inspector, a renderer, a list of approved parts.
The demand shows up in our data. Mermaid, the text format most AI tools use to draw diagrams today, gained 602 stars in the 30 days to September 27. Archify and Diagram Design, two diagram tools built for agents, gained 44,977 and 14,401. No project we track gained more than Archify.
The lineup
Project | What it makes | What keeps it honest | Stars |
|---|---|---|---|
Diagram Design | Diagrams in your site's style | A designer's rulebook | ~43K |
Archify | Diagrams that pass checks | An automatic inspection | ~74K |
HyperFrames | Videos | The same video every time | ~54K |
json-render | App screens | A list of parts you approve | ~18K |
Keep an eye on the star column. The closing adds a second number that ranks these four differently.

Style it - Diagram Design

Diagram Design makes an agent's diagrams look like they belong on your site.
Think of it as a brand guide for diagrams. You give it your website address once. It reads your colors and fonts, and every diagram after that uses them. It also follows a designer's rules: few boxes, one highlight color, no shadows.
We tried it on star-history.com. The diagram above shows how a README chart gets made, in our white, charcoal and green. One thing didn't carry over: the hand-drawn font from our charts. The tool only accepts fonts from Google's free font library.
Cathryn Lavery, who runs BestSelf.co, built it because every diagram Claude drew for her was "a generic rounded-box thing that looked nothing like the rest of the site." She shipped it as a skill, a folder of instructions the agent reads before it draws (more on skills). The repo had 2,872 stars at the end of July and gained 26,241 in August.
Tradeoffs
No program checks whether a diagram looks good. The agent grades itself against the author's taste
No version numbers on GitHub, so it is hard to stay on a version you like
Best for: diagrams in blog posts and docs.
Check it - Archify

Archify checks an agent's diagram before you see it.
Here is how it goes. You tell your coding agent, "Draw how our payment service works: the website talks to a server, the server saves to a database and hands slow jobs to a background worker." Without Archify, the agent draws something, and you are the one who notices that two labels overlap or an arrow runs through a box. Then you ask again.
With Archify installed, the agent doesn't draw. It writes down the boxes and the arrows between them in Archify's format, then runs Archify. Archify draws the diagram as a web page you can click around in, and checks it: the layout, the routes the arrows take, the space between labels and lines. If a check fails, Archify says which rule failed and what may change, and the agent fixes it. It gets two tries. The diagram you open is one that passed. The screenshot above shows one, with "9/9 validation checks" printed on it.
Archify lists itself on GitHub as a Mermaid alternative. The chart below starts each project at its first day, and Mermaid is the long line.

Its growth is the steepest in this post: 8,189 stars at the end of July, 5,068 in a single day on August 27, and 44,977 in the 30 days to September 27. Most of the code comes from one person, tt-a1i. The day after DeepSeek Harness (last month's subject) launched, Archify had a plugin for it.
Tradeoffs
"Checked" means the picture matches what the agent wrote down. If the agent misunderstood your system, the diagram is wrong and still passes
It won't import Mermaid files and has no drag-and-drop editor
Best for: architecture diagrams you send to other people.
Render it - HyperFrames

HyperFrames lets an agent make a video the way it makes a web page.
The agent writes an ordinary web page and marks when each element should appear. HyperFrames plays the page frame by frame and records it as a video file. The same page always gives the same video, so you can fix a typo and make the video again, the way you would rebuild a website.
It comes from HeyGen, an AI video company, and its README says it is "inspired by Remotion," an older tool that does the same job from program code. HyperFrames bets that a plain web page is easier for agents to write.

Remotion has 61K stars after six years, and 25,873 of them arrived since early February. HyperFrames has 54K after six months.
Tradeoffs
Making a video takes real computing power, because it runs a whole browser behind the scenes. Its own README says Remotion's cloud service is more mature
It changes fast: 442 releases in six months, about two a day
Best for: product demos and new-feature videos you want to remake automatically.
Limit it - json-render

json-render lets an AI answer with a screen instead of a paragraph, built only from parts your app already has.
Here is the problem it solves. A user of your app asks, "How did sales go this week?" A chatbot answers with text. A better answer is a small chart with a table under it. But you can't let the model write its own interface code. It would look different every time, and it might break.
json-render sits in between. You hand the model a list of parts your app already has, say a chart, a table and a button. The model replies with a list of instructions: a chart with these numbers, then a table with these rows. Your app draws that with its own parts. The result looks like your product because it is made of your product. The screenshot above is the demo on json-render.dev: you type what you want, the model's instructions appear on the left, and the finished card appears on the right.
It is also a reply to our March post, As AI Turns Prevalent, UI Becomes Irrelevant: the interface is still there, and the model now assembles it for each question. Most of the code is by one Vercel engineer, Chris Tate, and it is the quietest of the four on GitHub, with 2,324 stars in the 30 days to September 27 against Archify's 44,977.
Tradeoffs
You have to build the list of parts first, so it takes developer time before anything appears
An experimental project maintained mostly by one person
Best for: products where an AI answer should look like the product, with charts and tables instead of paragraphs.
Closing Thoughts
Back to the star column. A star tells you someone noticed a project. It doesn't tell you they used it, so it helps to have a second number.
Project | Stars | How people get it | Second number |
|---|---|---|---|
json-render | ~18K | npm, the package store for JavaScript | 6.08M downloads in 30 days |
HyperFrames | ~54K | One install command | 724.9K installs of its top skill |
Archify | ~74K | One install command | 120.9K installs of its top skill |
Diagram Design | ~43K | Plugin stores | Not published |
The order changes. json-render has the fewest stars and by far the largest usage number. Archify and HyperFrames both have more installs than stars.
The install numbers are new. The command is npx skills add, and a site called skills.sh counts each time it runs. These numbers are rough. One person, or one automated build, can be counted many times.
Diagram Design has almost no second number. skills.sh shows 7.3K installs, but its README sends people to the plugin stores inside Claude Code, Codex and Copilot, and those stores don't publish counts. It gained 14,401 stars in 30 days, and nobody outside can say how many of those people drew a diagram with it.
So read this month's stars as attention. Agents that make diagrams, videos and screens got a lot of it. Whether people keep using them shows up in the second number, where there is one.
