Excalidraw

Virtuelles Whiteboard zum Skizzieren von handgezeichneten Diagrammen GitHub: https://github.com/excalidraw/excalidraw

---

Übersicht

Excalidraw ist eine kostenlose, Open-Source-Anwendung für virtuelle Whiteboards, mit der Benutzer Diagramme, Flussdiagramme, Wireframes und Skizzen mit einer unverwechselbaren handgezeichneten Ästhetik erstellen können. Als React-Komponente entwickelt und als npm-Paket veröffentlicht, kann es eigenständig unter excalidraw.com verwendet oder direkt in andere Anwendungen eingebettet werden.

Das Projekt wurde ursprünglich von Christopher Chedeau (vjeux) ins Leben gerufen und hat sich seitdem zu einer florierenden Open-Source-Community entwickelt, die von Unternehmen wie Google Cloud, Meta, CodeSandbox, Replit, Notion und Obsidian übernommen wurde.

---

Kernfunktionen

Zeichenwerkzeuge

• Grundformen: Rechteck, Kreis, Raute, Pfeil, Linie
• Freihandzeichnen und Radiergummi
• Textwerkzeug mit benutzerdefinierten Schriftarten (Excalifont)
• Pfeilbindung und beschriftete Pfeile
• Formbibliotheken für wiederverwendbare Komponenten

Canvas & Benutzeroberfläche

• Unendlicher Canvas mit Zoom- und Schwenkunterstützung
• Dunkelmodus
• Rückgängig-/Wiederherstellen-Verlauf
• Tastenkombinationen für effizienten Workflow
• Anpassbare Strichstärke, Rauheit, Farbe und Füllung

Zusammenarbeit & Teilen

• Echtzeit-Multiplayer-Kollaboration über teilbare Links
• Ende-zu-Ende-Verschlüsselung für sichere Sitzungen
• Nur-Lese-Links zum Anzeigen
• PWA-Unterstützung – funktioniert vollständig offline
• Lokal-first: automatische Speicherung im Browser-Speicher

Export & Integration

• Export nach PNG, SVG und Zwischenablage
• Export/Import im .excalidraw JSON-Format (offen, menschenlesbar)
• Einbettbar als React-Komponente über das npm-Paket @excalidraw/excalidraw
• Integriert in Tools wie Obsidian, VS Code-Erweiterungen, Notion und mehr

Lokalisierung

• Vollständige i18n-Unterstützung (Internationalisierung) mit mehreren Sprachen

---

Technische Basis

Ebene	Technologie
Frontend	React, TypeScript
Canvas	HTML5 Canvas API
Zeichnen	Rough.js (handgezeichnetes Rendering)
Schriftarten	Excalifont (benutzerdefiniert), Virgil (Legacy)
Paket	Veröffentlicht auf npm als @excalidraw/excalidraw
Lizenz	MIT

---

Anwendungsfälle

• Systemarchitekturdiagramme – informelle, aber ausdrucksstarke Skizzen für technische Teams
• Wireframing & UI-Mockups – schnelle Low-Fidelity-Prototypen vor Figma
• Brainstorming & Ideenfindung – visuelles Denken in Meetings oder asynchron
• Lehre & Präsentationen – der handgezeichnete Stil hält den Inhalt zugänglich
• Dokumentation – Live-Diagramme in Wikis, Notion-Seiten oder README-Dateien einbetten

---

Excalidraw+ (Premium)

Über die kostenlose Open-Source-Version hinaus bietet das Team Excalidraw+ an, ein kostenpflichtiges Cloud-Produkt, das Folgendes hinzufügt:

• Cloud-Speicher und organisierte Arbeitsbereiche
• Persistente Kollaborationssitzungen
• Sprachchat innerhalb des Canvas
• Präsentationsmodus (folienbasierter Export nach PPTX/PDF)
• Berechtigungsverwaltung und Gastfreigabe
• 14-tägige kostenlose Testversion verfügbar

---

Community & Akzeptanz

• Sterne: 90.000+ GitHub-Sterne (eines der am meisten gestarteten Whiteboard-Tools)
• Mitwirkende: 800+ Open-Source-Mitwirkende
• Genutzt von: Google Cloud, Meta, CodeSandbox, Obsidian, Replit, Slite, Notion, HackerRank
• Integrationen: VS Code-Erweiterung, Obsidian-Plugin, Confluence-Plugin und mehr

---

Erste Schritte

Online nutzen

Gehen Sie zu https://excalidraw.com – keine Anmeldung erforderlich.

Selbst hosten / Einbetten

npm install @excalidraw/excalidraw

import { Excalidraw } from "@excalidraw/excalidraw";

export default function App() {
  return <Excalidraw />;
}

Lokal ausführen

git clone https://github.com/excalidraw/excalidraw.git
cd excalidraw
npm install
npm start

---

Zusammenfassung

Excalidraw hebt sich von anderen Diagramm-Tools ab, indem es bewusst die handgezeichnete Ästhetik einsetzt – mit rauen Kanten und fließenden Linien, die den Inhalt informell halten und auf Ideen statt auf Perfektion fokussieren. Seine Kombination aus reibungslosem Einstieg (keine Anmeldung erforderlich), leistungsstarker Zusammenarbeit, offenem Format und Einbettbarkeit als React-Bibliothek macht es zur bevorzugten Wahl für Entwickler, Designer und Teams weltweit.