Product Thumbnail

Mermaid Whiteboard

Drag & drop whiteboard with text based diagramming

Web App
Design Tools
Productivity

Mermaid's Whiteboard combines the power of Mermaid JS with the intuitiveness of a drag-and-drop interface used by traditional diagramming tools. Generate diagrams with Mermaid AI then easily move, resize and adjust your nodes with the Mermaid Whiteboard.

Top comment

Hey Product Hunters! 👋 First off, a huge thank you to this amazing community for hunting us! 🎯 As passionate users of Mermaid JS, we’ve always loved how it empowers users to create diagrams from code. But we also recognized a gap—the need for a more intuitive, visual interface without losing the power of code-based diagramming. That’s why we’re thrilled to introduce Mermaid Whiteboard! 🎉 💡 The Problem While text-based diagramming with Mermaid JS is powerful, it can sometimes be less accessible for those who prefer a visual approach. Traditional drag-and-drop tools are intuitive but often lack the efficiency and precision that code offers. Switching between code and visual tools disrupts workflow and collaboration. 🚀 The Solution Enter Mermaid Whiteboard—the best of both worlds! 1️⃣ Generate Diagrams with Mermaid AI: Start by creating diagrams using the power of Mermaid AI. 2️⃣ Intuitive Drag-and-Drop Interface: Easily move, resize, and adjust your nodes just like in traditional diagramming tools. 3️⃣ Enhanced Features: Enjoy real-time collaboration with synced positions during live editing, undo/redo functionality, support for self-loop edges, and export your diagrams as PNGs with fixed layouts. We’ve listened to the community and packed in features you’ve been asking for to make diagramming smoother and more efficient. 🎯 Why It Matters Clear visual communication is crucial in any field. With Mermaid Whiteboard, you don’t have to choose between the precision of code and the ease of visual editing. It’s a seamless experience that boosts productivity and makes collaboration a breeze. Let me know what you think in the comments! Your feedback means the world to us. 💬 Happy diagramming! 🖌️🔷

Comment highlights

This drag-and-drop functionality could really streamline the workflow. Looking forward to trying it!

Congrats on the launch! :) I love the concept of combining the power of Mermaid JS with a more visual approach! How do you see Mermaid Whiteboard evolving in the future to further enhance user experience and collaboration?

I love the design! This will definitely enhance the user experience for visualizing ideas.

Congratulations on the launch! Excited to see how this enhances collaboration and productivity! ✨

Big fan of Mermaid AI, excited to see this feature -- which I've previously requested -- be released! love it

This is super amazing, and shows how much Mermaid Chart cares about continuously pushing for greater ability to work with MermaidJs diagrams, while retaining the core of what makes mermaid so good. As a former developer here, I am eager to see the great new features that are still to come from this company!

Hey, this looks super fun! Can't wait to play around with the whiteboard feature!

Congratulations @knut_sveidqvist . I checked your website and I must say the multiple editing tools and user-friendly interface of Mermaid Chart make creating and tweaking diagrams a joy!

So you’re saying I can make complex diagrams without messing up the syntax? Pinch me, I’m dreaming

Mermaid Whiteboard looks like a really neat solution! Haven't tried it yet, but the blend of code and drag-and-drop sounds super useful. Congrats on the launch!

So glad I found a tool that combines text based diagramming with easy copy and paste. Excited to explore it more!

Gave the AI integration a short, and I'm impressed with how smoothly it works. It’s cutting down the time I spend on complex flowcharts by a lot!

Congratulations on the launch! From the day I heard of Mermaid I started using it and now >90% my diagrams are made with Mermaid.

New features are great! I love how easy it is to switch between coding and visual editing. Makes diagramming feel so smooth.

Love the flexibility this tool offers. Whether I want to code diagrams or just use the GUI, it’s simple and straightforward.

Super excited about the plugins, especially for VS Code. Integrating diagrams directly into my workflow without leaving the IDE is brilliant!

The different themes are such a nice touch! It really helps when working long hours to switch up the visual style.