hn.today

Show HN: Reladraw – A diagram language where you decide where to place things

github.com227 points64 comments

Reladraw is a text-first diagram language that lets authors state where things go using relative placement sentences instead of coordinates or pure auto-layout. It fills the gap between auto-layout tools (Mermaid, Graphviz) and absolute-position editors (Figma, draw.io) by making every location a relation like "node app.api below app.ui" or "edge app.api -> store from:right to:left". The repository includes a syntax reference, examples, a TypeScript parser/resolver, an SVG renderer and a CLI (installable via npm). It ships an agent "skill" so language models can be taught the syntax and then write or edit layouts directly; agents read the same sentences they emit instead of guessing a layout from pixels or re-rendering to inspect results. Version 0.4.0 runs, but the language is evolving.

Placement is solved deterministically: constraints are minimum gaps and the resolver finds the tightest arrangement via longest-path computation on each axis, guaranteeing a single solution without search or incremental nudging. Non-overlap is enforced by deriving separations from stated relations; when the file leaves pairs unordered the tool names them rather than guessing. Planned features include machine-readable diagnostics (overlaps, crossed edges, overflowing text), node-avoiding edge routing, and more icons. The design lets an agent fix layout problems by editing text statements and re-running the resolver, avoiding pixel arithmetic or vision-based checks.

Read on github.com64 comments on Hacker News

Summary generated by AI from the linked article. hn.today is not affiliated with Hacker News or Y Combinator.

More in Programming

The daily digest

Today's best Hacker News stories, summarized and screenshotted, one email a day.