Mermaid Bridge

About this plugin

v1.1.0 — Now a two-way bridge 🎉• NEW: FigJam → Mermaid. Select shapes, connectors and sections and turn themback into Mermaid flowchart code, inserted as a code block.• NEW: resizable window — the live preview now grows to fill it and scales thediagram to fit.• Fixed: first run no longer opens with an empty editor.• Fixed: snake_case / arithmetic in labels (user_id, 2*3) are no longer mangled.• Fixed: “#” in extracted labels now round-trips correctly on re-import.• Fixed: nested subgraphs no longer drop their outer Section.------------------------------------------------------------------Mermaid Bridge turns Mermaid flowchart code into native FigJam objects. Shapes, connectors, sections — everything stays editable after import, exactly as if you'd drawn it by hand.WHAT YOU GET• Native FigJam shapes: rectangle, rounded, diamond, ellipse, parallelogram, hexagon, cylinder, and more. Each one auto-sized to fit its label.• Real FigJam connectors with arrow heads, dash styles, edge labels, and bidirectional arrows.• Subgraphs become nested FigJam Sections; the whole diagram lands inside one outer wrapper Section, so you can move or duplicate it as a single unit.HOW IT WORKSPaste or type Mermaid code (or pick a built-in example).Watch the live SVG preview as you type.Click "Generate in FigJam" — the plugin creates the diagram on canvas, centred on your viewport.POWER USER FEATURES• Tidy layout (optional) — assigns deterministic edge sides: Yes-right, No-left for decision diamonds; entry-top, exit-bottom for forward flow; perpendicular loop-backs. Yes/No is recognised in English, Ukrainian, and Russian.• Colorize — recolour the entire import to a single hue with auto-contrasting strokes and label colours.• Five font-size presets (XS / S / M / L / XL) and a spacing slider.• Style passthrough — Mermaid style, classDef, and :::class carry fills, strokes, dashes, and label colours into FigJam.• Inline bold, *italic*,
, and click X "url" hyperlinks inside node and edge labels.SUPPORTED SYNTAXDesigned for flowchart / graph diagrams. Sequence, state, class, ER, and other non-flow diagram types will render in the preview but won't produce meaningful FigJam output — they don't map to nodes and edges.PRIVACYThe plugin loads Mermaid from cdn.jsdelivr.net to render diagrams locally in the plugin UI. No diagram content, telemetry, or analytics is sent anywhere. Draft input and UI preferences are stored only in your browser's localStorage.