Beauty Diagram - Diagrams that don't look like they were auto-generated

@liviu_chita Sharp distinction — and honestly one we’ve thought a lot about.

The version live today uses a unified visual reveal: the same animation language works across flowcharts, sequence diagrams, swimlane, mind maps, etc. So it’s consistent across diagram types, but it’s not yet semantically following the actual logic flow.

We did experiment with flow-driven animation, where nodes/edges reveal in the diagram’s logical order. It works really well for flowcharts, but gets trickier across other diagram types because “logic flow” means different things in a sequence diagram, swimlane, or mind map.

So for v1, I chose consistency as the default. It should make the diagram easier to present, but I agree with your distinction: for some use cases, animation should communicate the flow, not just look nice.

That’s where I want to take it next: opt-in flow-aware animation per diagram type, and eventually more control over sequence/timing. The goal is: nice by default, with manual controls for timing, sequence, and effects when you need the animation to communicate a specific flow.

And yeah, glad the CLI/API direction lands.

Thanks @alex_spitz , really appreciate you testing it.

Our default goal is still the one-click flow: pick a theme and get a polished diagram quickly, without manually tuning every node.

But we also support interactive customization on the canvas for cases like yours. Right now the customization options are still limited, but you can already click elements and adjust things like block/line borders, backgrounds, and text colors.

We’ll keep expanding this, including more font and brand-style controls over time. For your mind map use case, would saved brand presets be enough, or would you prefer detailed per-element control?

Thanks @vishal7017 

And yes, Notion’s Mermaid rendering is one of the cases I had in mind. The output can get pretty rough sometimes, even down to edges/lines looking slightly off, so I totally get the frustration.

For dark mode docs, I usually reach for the Obsidian theme first. It has that subtle glowing-on-dark look, which tends to fit dark documents really well.

Another option is to use one of the lighter, more colorful themes and export it with a transparent background. That way you don’t end up with a bright diagram sitting awkwardly inside a dark doc.

One small tip: before exporting a light theme with transparency, it may help to use Customize mode to lighten any darker lines or strokes on the canvas, so they stay readable on a dark background.

@sounak_bhattacharya Great question — today `bd` CLI is single-shot:

`bd input.mmd -o output.svg --theme obsidian`

So right now it’s one file in, one styled SVG out. That works well inside a build step or GitHub Action if you wire it around specific files, but directory watch / native batch processing isn’t in the CLI yet.

Batch mode is actively in the works though, and the goal is exactly your scenario: point `bd` at a directory or glob, regenerate all diagrams in one pass, and make it part of `npm run build` or CI.

Longer term, I also want this to fit into automated docs workflows more broadly. I’ve written a Beauty Diagram SKILL for agent workflows too, so an agent can watch what changed and regenerate the right diagrams

Quick question back: are your Mermaid diagrams usually inline code blocks inside Markdown, or standalone `.mmd` files? That affects whether batch mode should start as a simple glob, or include a Markdown extraction step too.

Thank you, @wakuta . This is really valuable feedback.

You’re right that for Japanese/CJK use cases, 'beautiful' is not enough if fonts, line breaks, labels or dense stakeholder diagrams are unreliable. For developer documentation, PRDs and stakeholder presentations, the output needs to look native to the document.

I’ll take this on board: CJK font handling, line wrapping and Japanese-friendly templates and presets are now on my list of things to explore more deliberately.

@noahzeph Exactly. That screenshot/redraw step is the whole pain point I wanted to remove.

Mermaid/PlantUML are great for quickly creating diagrams, especially with the AI, but the output often needs extra polish before it is ready for docs or decks.