2023-02-15 13:45:06 +00:00
< a href = "https://excalidraw.com/" target = "_blank" rel = "noopener" >
< picture >
2023-09-11 15:47:41 +00:00
< source media = "(prefers-color-scheme: dark)" alt = "Excalidraw" srcset = "https://excalidraw.nyc3.cdn.digitaloceanspaces.com/github/excalidraw_github_cover_2_dark.png" / >
< img alt = "Excalidraw" src = "https://excalidraw.nyc3.cdn.digitaloceanspaces.com/github/excalidraw_github_cover_2.png" / >
2023-02-15 13:45:06 +00:00
< / picture >
< / a >
< h4 align = "center" >
< a href = "https://excalidraw.com" > Excalidraw Editor< / a > |
< a href = "https://blog.excalidraw.com" > Blog< / a > |
< a href = "https://docs.excalidraw.com" > Documentation< / a > |
< a href = "https://plus.excalidraw.com" > Excalidraw+< / a >
< / h4 >
< div align = "center" >
< h2 >
An open source virtual hand-drawn style whiteboard. < / br >
Collaborative and end-to-end encrypted. < / br >
< br / >
2023-04-07 15:43:50 +00:00
< / h2 >
2023-02-15 13:45:06 +00:00
< / div >
< br / >
< p align = "center" >
< a href = "https://github.com/excalidraw/excalidraw/blob/master/LICENSE" >
< img alt = "Excalidraw is released under the MIT license." src = "https://img.shields.io/badge/license-MIT-blue.svg" / >
2023-11-01 12:27:57 +00:00
< / a >
< a href = "https://www.npmjs.com/package/@excalidraw/excalidraw" >
< img alt = "npm downloads/month" src = "https://img.shields.io/npm/dm/@excalidraw/excalidraw" / >
2020-01-25 14:30:01 +00:00
< / a >
2023-02-15 13:45:06 +00:00
< a href = "https://docs.excalidraw.com/docs/introduction/contributing" >
< img alt = "PRs welcome!" src = "https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat" / >
< / a >
< a href = "https://discord.gg/UexuTaE" >
< img alt = "Chat on Discord" src = "https://img.shields.io/discord/723672430744174682?color=738ad6&label=Chat%20on%20Discord&logo=discord&logoColor=ffffff&widge=false" / >
< / a >
< a href = "https://twitter.com/excalidraw" >
< img alt = "Follow Excalidraw on Twitter" src = "https://img.shields.io/twitter/follow/excalidraw.svg?label=follow+@excalidraw&style=social&logo=twitter" / >
< / a >
< / p >
< div align = "center" >
< figure >
< a href = "https://excalidraw.com" target = "_blank" rel = "noopener" >
< img src = "https://excalidraw.nyc3.cdn.digitaloceanspaces.com/github%2Fproduct_showcase.png" alt = "Product showcase" / >
2020-03-06 14:20:02 +00:00
< / a >
2023-02-15 13:45:06 +00:00
< figcaption >
< p align = "center" >
Create beautiful hand-drawn like diagrams, wireframes, or whatever you like.
< / p >
< / figcaption >
< / figure >
2020-01-04 15:25:10 +00:00
< / div >
2020-01-03 23:29:13 +00:00
2023-02-15 13:45:06 +00:00
## Features
2020-01-03 23:29:13 +00:00
2023-02-15 13:45:06 +00:00
The Excalidraw editor (npm package) supports:
2020-01-03 23:29:13 +00:00
2023-02-15 13:45:06 +00:00
- 💯 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.
2023-02-01 14:27:54 +00:00
2023-02-15 13:45:06 +00:00
## Excalidraw.com
2021-01-14 16:31:52 +00:00
2023-10-03 13:41:13 +00:00
The app hosted at [excalidraw.com ](https://excalidraw.com ) is a minimal showcase of what you can build with Excalidraw. Its [source code ](https://github.com/excalidraw/excalidraw/tree/master/excalidraw-app ) is part of this repository as well, and the app features:
2021-02-06 16:12:35 +00:00
2023-02-15 13:45:06 +00:00
- 📡 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).
2021-02-06 16:12:35 +00:00
2023-02-15 13:45:06 +00:00
We'll be adding these features as drop-in plugins for the npm package in the future.
2021-02-06 16:12:35 +00:00
2023-02-15 13:45:06 +00:00
## Quick start
2021-02-06 16:12:35 +00:00
2023-12-16 18:18:35 +00:00
**Note:** following instructions are for installing the Excalidraw [npm package ](https://www.npmjs.com/package/@excalidraw/excalidraw ) when integrating Excalidraw into your own app. To run the repository locally for development, please refer to our [Development Guide ](https://docs.excalidraw.com/docs/introduction/development ).
2021-03-14 14:02:36 +00:00
2023-02-15 13:45:06 +00:00
```
npm install react react-dom @excalidraw/excalidraw
```
or via yarn
2021-03-14 14:02:36 +00:00
2023-02-15 13:45:06 +00:00
```
yarn add react react-dom @excalidraw/excalidraw
```
2020-01-03 23:29:13 +00:00
2023-12-16 18:18:35 +00:00
Check out our [documentation ](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/installation ) for more details!
2020-01-03 23:29:13 +00:00
2023-02-15 13:45:06 +00:00
## Contributing
- Missing something or found a bug? [Report here ](https://github.com/excalidraw/excalidraw/issues ).
- Want to contribute? Check out our [contribution guide ](https://docs.excalidraw.com/docs/introduction/contributing ) or let us know on [Discord ](https://discord.gg/UexuTaE ).
- Want to help with translations? See the [translation guide ](https://docs.excalidraw.com/docs/introduction/contributing#translating ).
## Integrations
- [VScode extension ](https://marketplace.visualstudio.com/items?itemName=pomdtr.excalidraw-editor )
- [npm package ](https://www.npmjs.com/package/@excalidraw/excalidraw )
2021-04-21 09:22:38 +00:00
2023-02-01 14:27:54 +00:00
## Who's integrating Excalidraw
2020-01-04 02:19:58 +00:00
2023-02-15 13:45:06 +00:00
[Google Cloud ](https://googlecloudcheatsheet.withgoogle.com/architecture ) • [Meta ](https://meta.com/ ) • [CodeSandbox ](https://codesandbox.io/ ) • [Obsidian Excalidraw ](https://github.com/zsviczian/obsidian-excalidraw-plugin ) • [Replit ](https://replit.com/ ) • [Slite ](https://slite.com/ ) • [Notion ](https://notion.so/ ) • [HackerRank ](https://www.hackerrank.com/ ) • and many others
## Sponsors & support
If you like the project, you can become a sponsor at [Open Collective ](https://opencollective.com/excalidraw ) or use [Excalidraw+ ](https://plus.excalidraw.com/ ).
## Thank you for supporting Excalidraw
[<img src="https://opencollective.com/excalidraw/tiers/sponsors/0/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/0/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/1/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/1/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/2/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/2/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/3/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/3/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/4/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/4/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/5/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/5/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/6/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/6/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/7/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/7/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/8/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/8/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/9/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/9/website ) [<img src="https://opencollective.com/excalidraw/tiers/sponsors/10/avatar.svg?avatarHeight=120"/> ](https://opencollective.com/excalidraw/tiers/sponsors/10/website )
< a href = "https://opencollective.com/excalidraw#category-CONTRIBUTE" target = "_blank" > < img src = "https://opencollective.com/excalidraw/tiers/backers.svg?avatarHeight=32" / > < / a >
Last but not least, we're thankful to these companies for offering their services for free:
[](https://vercel.com) [](https://sentry.io) [](https://crowdin.com)
