34Twenty-six kinds
Flowcharts, class and state diagrams, Gantt charts, mind maps, timelines and more — described in Mermaid, a plain-text diagram language, and placed on the board as a picture you can size and arrange.
Find itInsert → Diagram from code…, or the Shapes panel.
StartPick a type along the top and a working example appears — edit it rather than learning the syntax cold. The preview redraws as you type.
What's thereFlowchart, Sequence, Class, State, ER, Mind map, Timeline, Gantt, Kanban, Journey, Pie, XY chart, Quadrant, Radar, Treemap, Sankey, Block, Packet, Git graph, C4 context, Requirement, Architecture, Swimlane, Fishbone, Venn and Cynefin.
Place itPlace on board drops it in the middle, selected and ready to drag. It behaves like any picture: resize handles, rotate, crop, bring to front, send to back.
Mind map is differentA Mind map from code becomes a real, editable mind map, not a picture.
Edit laterDouble-tap it to reopen the code. The code is saved inside the .slate file, so a lesson can be reopened and one line changed rather than the whole thing redrawn.
First use is slowerThe diagram engine is only fetched the first time you open this panel, so Slate itself starts as quickly as ever. After that it is cached and works offline like everything else.
Part of the Slate guide — or read the whole guide on one page.