Interactive & Compact Mind Maps

We’ve added some powerful new features to our MindMap component to handle larger datasets and provide a better reading experience.

1. Interactive Fullscreen

Got a huge map? No problem. Double-click the map below to go fullscreen. Double-click again (or press Esc) to exit.

<MindMap 
  interactive={true} 
  data={{ ... }} 
/>

2. Compact & “Perfect” Style

Sometimes the hand-drawn, tilted look takes up too much space. Use compact={true} and straightEdges={true} for a cleaner, tighter layout.

<MindMap 
  compact={true} 
  straightEdges={true} 
  data={{ ... }} 
/>

3. Light Mode Optimized

These components automatically adapt to light and dark mode, ensuring high contrast for text labels even when branches are colorful.