plane icon indicating copy to clipboard operation
plane copied to clipboard

[feature]: Support Mermaid diagrams inside Markdown (GitHub-style)

Open leandroluk opened this issue 1 month ago • 2 comments

Is there an existing issue for this?

  • [x] I have searched the existing issues

Summary

It would be extremely helpful if Plane supported Mermaid diagrams directly inside Markdown content, similar to how GitHub and other tools do.

Example syntax:

```mermaid
graph TD
  A[Feature] --> B[Spec]
  B --> C[Implementation]
  C --> D[Release]
```

Why should this be worked on?

Today, if we paste Mermaid code blocks in Plane, they are rendered as plain text instead of diagrams. Native rendering would make specs, architecture documents, and flows much easier to understand and maintain.

Why this matters

  • Improves documentation quality without leaving Plane
  • Makes it easier to share system architecture, flows, and dependencies
  • Reduces the need for external tools (Miro, draw.io, etc.) just to keep diagrams updated
  • Fits naturally into Markdown-heavy workflows that many dev teams already use

Suggested behavior

  • Detect ```mermaid code blocks in Markdown
  • Render them as SVG/canvas diagrams
  • Fallback gracefully to plain text if rendering fails (invalid Mermaid, etc.)
  • Optional: toggle to show “code vs rendered diagram”

Bonus (nice to have)

  • Support Mermaid in comments as well as description fields
  • Dark/light theme aware diagrams
  • Basic error message when Mermaid syntax is invalid

Thanks — this would be a huge quality-of-life improvement for anyone using Plane to write technical specs.

leandroluk avatar Nov 20 '25 12:11 leandroluk

hey can i attempt this or can i work along??

atharvamhaske avatar Nov 20 '25 19:11 atharvamhaske

Hi @leandroluk Thanks for submitting the feature request. We’ll review this with our product team internally and add it to our roadmap.

pushya22 avatar Nov 24 '25 09:11 pushya22