What it is
Excalidraw is an open-source virtual whiteboard application built in TypeScript, designed for sketching hand-drawn style diagrams, wireframes, and freeform ideas. It lives within the web-based productivity and design visualization ecosystem, offering a lightweight alternative to commercial tools like Figma, Miro, and Canva. The project includes both a standalone web app at excalidraw.com and an embeddable npm package for integration into third-party applications.
It solves the problem of needing a simple, collaborative, and privacy-respecting whiteboard that avoids vendor lock-in and complex infrastructure. Users can sketch ideas quickly with a natural, pen-like aesthetic, share them via read-only links, and collaborate in real time—all while maintaining control over their data through end-to-end encryption and local-first storage.
Key capabilities
- Infinite canvas-based whiteboard with pan and zoom support
- Hand-drawn style rendering for shapes, arrows, and freehand drawing
- Real-time collaborative editing with end-to-end encryption
- Export to PNG, SVG, clipboard, and
.excalidraw JSON files
- Undo/redo, arrow binding, labeled arrows, and shape libraries
- Dark mode and full localization (i18n) support
- PWA support with offline functionality
Who uses it and how
- Google Cloud uses it in architecture documentation workflows via their cheatsheet platform
- Meta integrates Excalidraw for internal ideation and diagramming
- Obsidian users embed Excalidraw diagrams directly into markdown notes via a third-party plugin
- Replit and CodeSandbox embed the whiteboard in their developer environments for prototyping
- Notion and HackerRank use it for collaborative problem-solving and whiteboarding in shared contexts
Getting started
Install the @excalidraw/excalidraw npm package alongside React and React DOM, or run the app locally using Docker or by cloning the repository and following the development guide. The hosted version at excalidraw.com requires no setup and works directly in the browser.
When to use it — and when not to
Excalidraw replaces paid whiteboard tools for teams prioritizing open formats, privacy, and self-hosting, but lacks native advanced features like version history, granular permissions, or enterprise support. Self-hosting requires managing authentication, storage (for persistent sessions), and optionally SMTP for notifications—though the app defaults to local browser storage and ephemeral sessions. It is unsuitable for high-fidelity UI design or complex project management, but ideal for rapid sketching, technical diagrams, and collaborative brainstorming where speed and simplicity matter more than polished output.
project readme (upstream, from github) — read inline
An open source virtual hand-drawn style whiteboard.
Collaborative and end-to-end encrypted.
Create beautiful hand-drawn like diagrams, wireframes, or whatever you like.
Features
The Excalidraw editor (npm package) supports:
- 💯 Free & open-source.
- 🎨 Infinite, canvas-based whiteboard.
- ✍️ Hand-drawn like style.
- 🌓 Dark mode.
- 🏗️ Customizable.
- 📷 Image support.
- 😀 Shape libraries support.
- 🌐 Localization (i18n) support.
- 🖼️ Export to PNG, SVG & clipboard.
- 💾 Open format - export drawings as an
.excalidraw json file.
- ⚒️ Wide range of tools - rectangle, circle, diamond, arrow, line, free-draw, eraser...
- ➡️ Arrow-binding & labeled arrows.
- 🔙 Undo / Redo.
- 🔍 Zoom and panning support.
Excalidraw.com
The app hosted at excalidraw.com is a minimal showcase of what you can build with Excalidraw. Its source code is part of this repository as well, and the app features:
- 📡 PWA support (works offline).
- 🤼 Real-time collaboration.
- 🔒 End-to-end encryption.
- 💾 Local-first support (autosaves to the browser).
- 🔗 Shareable links (export to a readonly link you can share with others).
We'll be adding these features as drop-in plugins for the npm package in the future.
Quick start
Note: following instructions are for installing the Excalidraw npm package when integrating Excalidraw into your own app. To run the repository locally for development, please refer to our Development Guide.
Use npm or yarn to install the package.
npm install react react-dom @excalidraw/excalidraw
# or
yarn add react react-dom @excalidraw/excalidraw
Check out our documentation for more details!
Contributing
Integrations
Who's integrating Excalidraw
Google Cloud • Meta • CodeSandbox • Obsidian Excalidraw • Replit • Slite • Notion • HackerRank • and many others
Sponsors & support
If you like the project, you can become a sponsor at Open Collective or use Excalidraw+.
Thank you for supporting Excalidraw
Last but not least, we're thankful to these companies for offering their services for free:
