Ian Xiaohei Illustrations vs Mermaid
Which should you use? A side-by-side look at what each one does, who it suits, what it costs, how hard it is to set up, and where each falls short.
Open source · MIT
A Codex Skill that guides AI agents to draw white-background hand-drawn Chinese article illustrations.
Open source · MIT
Generate diagrams from Markdown-like text, for docs and code.
The short answer
Choose Ian Xiaohei Illustrations if you need…
- Chinese-language writers who need body illustrations for articles or posts
- Knowledge and methodology content creators who want abstract ideas drawn as metaphors
- People using Codex who want a consistent visual style across many images
Choose Mermaid if you need…
- Developers who want diagrams stored as text alongside their code and docs
- Teams whose documentation is written in Markdown and needs diagrams
- Non-programmers who want to make diagrams using the Live Editor
- Projects that generate documentation as part of a build or production script
Side-by-side
| Ian Xiaohei Illustrations | Mermaid | |
|---|---|---|
| Type | AI model / agent | Dev tool |
| Price | Free and open source | Free and open source |
| Licence | MIT | MIT |
| GitHub stars | 13k | 91k |
| Setup difficulty | Intermediate | Beginner |
| How you get it | Clone and build from source | Install with a package manager |
| Main language | — | TypeScript |
| Last code update | 11 days ago | 5 days ago |
What each one is
Ian Xiaohei Illustrations
This is a Codex Skill, a set of instructions that tells an AI agent how to make 16:9 hand-drawn illustrations for Chinese articles, posts, and blogs. It follows a fixed visual style: white background, black line art, a small black character called Xiaohei, and a few red, orange, or blue Chinese handwritten notes. It is meant for article body images, not general illustration or slide-style infographics.
Mermaid
Mermaid is a JavaScript tool that turns short text descriptions into diagrams such as flowcharts and sequence diagrams. You write the diagram in a Markdown-inspired syntax and the renderer draws it, so the diagram can be edited as plain text. Its stated purpose is to keep documentation up to date with development.
Best for
Ian Xiaohei Illustrations
- Chinese-language writers who need body illustrations for articles or posts
- Knowledge and methodology content creators who want abstract ideas drawn as metaphors
- People using Codex who want a consistent visual style across many images
Mermaid
- Developers who want diagrams stored as text alongside their code and docs
- Teams whose documentation is written in Markdown and needs diagrams
- Non-programmers who want to make diagrams using the Live Editor
- Projects that generate documentation as part of a build or production script
Strengths
Ian Xiaohei Illustrations
- Clear, narrow visual style that the README describes in concrete terms
- Includes guidance on planning shots before generating images
- Installs by copying a folder into the Codex skills directory
Mermaid
- Diagrams are plain text, so they are easy to edit, diff, and version-control
- Works inside tools such as GitHub, according to the README
- Large, active open-source project with a published documentation site
Not ideal for
Ian Xiaohei Illustrations
- Anyone wanting commercial illustration, brand artwork, or polished flat design, since the style is intentionally sketchy and quirky
- Anyone needing PPT-style flowcharts or architecture diagrams, since the README says it is not an infographic template
- Anyone needing editable vector source files, since the default output is PNG only
Mermaid
- People who need pixel-precise, freeform illustration; the README describes it as text-defined diagrams rendered by a renderer
- Users who need a visual drag-and-drop editor as their main workflow, since the README centers on text input via the Live Editor
Trade-offs
Ian Xiaohei Illustrations
- Chinese text in generated images can contain typos, so the README advises short labels and regeneration
- Output depends on an external image model, which the README says may drift in style or add unwanted titles
- The README does not specify which image model is required or how it is accessed
Mermaid
- Layout and styling are controlled by the renderer, so fine visual control is limited by what the syntax supports
- Requires learning the Mermaid syntax for each diagram type
Getting started
Ian Xiaohei Illustrations
Clone the repository
git clone https://github.com/helloianneo/ian-xiaohei-illustrations.gitCopy the skill into the Codex skills directory
mkdir -p "${CODEX_HOME:-$HOME/.codex}/skills" && cp -R ./ian-xiaohei-illustrations "${CODEX_HOME:-$HOME/.codex}/skills/"Frequently asked questions
What is the difference between Ian Xiaohei Illustrations and Mermaid?
Ian Xiaohei Illustrations: A Codex Skill that guides AI agents to draw white-background hand-drawn Chinese article illustrations. Mermaid: Generate diagrams from Markdown-like text, for docs and code. Ian Xiaohei Illustrations suits chinese-language writers who need body illustrations for articles or posts, while Mermaid suits developers who want diagrams stored as text alongside their code and docs.
Are Ian Xiaohei Illustrations and Mermaid free?
Ian Xiaohei Illustrations: Free and open source. Mermaid: Free and open source.
Which is easier to set up, Ian Xiaohei Illustrations or Mermaid?
Mermaid is easier to get started with (rated beginner); Ian Xiaohei Illustrations is rated intermediate and usually needs more setup.
Is Ian Xiaohei Illustrations or Mermaid more popular?
Mermaid has more GitHub stars (91k) than Ian Xiaohei Illustrations (13k). Popularity isn't the same as fit — check which one matches your use case above.
What are other alternatives to Ian Xiaohei Illustrations and Mermaid?
Other options people compare them with include Excalidraw.
Keep comparing
Built from our catalogue entries for both products: open-source details come from each project's README (AI-assisted, refreshed weekly) and GitHub data; AI-tool details are editorial. Spotted something wrong? Let us know from either product's page.