# Drawnix — Open-Source Whiteboard with Mind Maps and Flowcharts

> An all-in-one whiteboard tool that combines freehand drawing, mind maps, flowcharts, and sticky notes in a single infinite canvas. Local-first with optional collaboration.

## Install

Save as a script file and run:

# Drawnix — Open-Source Whiteboard with Mind Maps and Flowcharts

## Quick Use
```bash
git clone https://github.com/plait-board/drawnix.git
cd drawnix
pnpm install
pnpm dev
# Open http://localhost:3000
```

## Introduction
Drawnix is an open-source whiteboard application that unifies mind mapping, flowcharts, freehand drawing, and text on a single infinite canvas. Built on the Plait framework, it delivers a fluid editing experience where different diagram types coexist and connect naturally. The local-first design means your data stays in the browser until you choose to export or sync.

## What Drawnix Does
- Creates mind maps with drag-and-drop branching and automatic layout
- Draws flowcharts with connectable shapes, arrows, and labels
- Provides freehand drawing tools for sketching and annotation
- Supports sticky notes, text blocks, and image embedding on the canvas
- Exports boards as PNG, SVG, or JSON for sharing and backup

## Architecture Overview
Drawnix is built with Angular and TypeScript on top of the Plait board engine, which provides the infinite canvas, element management, and plugin architecture. Each diagram type (mind map, flowchart, freehand) is implemented as a Plait plugin. Rendering uses SVG for structured elements and Canvas for freehand strokes. State is managed locally in the browser with IndexedDB persistence.

## Self-Hosting & Configuration
- Requires Node.js 18+ and pnpm for development builds
- Deploy the production build as static files behind any web server
- No backend server or database required for single-user mode
- Configure collaboration by connecting to a Yjs-compatible sync server
- Customize themes and default tool settings via the configuration file

## Key Features
- Unified canvas combining mind maps, flowcharts, and freehand sketches
- Real-time collaboration support via Yjs CRDT protocol
- Keyboard shortcuts and contextual toolbars for fast editing
- Automatic layout algorithms for mind map and tree diagrams
- Plugin architecture allowing custom element types and tools

## Comparison with Similar Tools
- **Excalidraw** — freehand-focused; Drawnix adds structured mind maps and flowcharts
- **tldraw** — SDK-oriented infinite canvas; Drawnix is a ready-to-use application
- **Miro** — commercial SaaS; Drawnix is self-hostable and open source
- **draw.io** — focused on technical diagrams; Drawnix emphasizes freeform creativity alongside structure

## FAQ
**Q: Does Drawnix support real-time collaboration?**
A: Yes. Drawnix uses the Yjs CRDT library, which enables conflict-free multi-user editing when connected to a sync server.

**Q: Can I use it offline?**
A: Yes. Drawnix is local-first and stores data in the browser. You can work offline and sync later.

**Q: What file formats can I export?**
A: Drawnix supports exporting boards as PNG images, SVG vector files, and JSON data for backup or migration.

**Q: Is there a mobile version?**
A: The web app is responsive and works on tablets. Touch input is supported for drawing and navigation.

## Sources
- https://github.com/plait-board/drawnix
- https://drawnix.com

---
Source: https://tokrepo.com/en/workflows/asset-f0401421
Author: Script Depot