Skip to content
OpenSourceSoftware.ai
Excalidraw logo

Excalidraw

excalidraw · Design

GitHub stars

134,800
—Awaiting first sync

Awaiting first sync

No measured star history yet

What is Excalidraw?

Excalidraw is a virtual whiteboard where everything looks hand-drawn, which keeps early diagrams and wireframes feeling like sketches rather than finished designs. People use it in the browser at excalidraw.com, while developers embed the same editor in their own apps. Running it yourself gives you the editor; live collaboration needs a separate server.

Excalidraw is a free whiteboard with a hand-drawn look for sketching diagrams, wireframes and ideas on an infinite canvas. The hosted app at excalidraw.com adds live collaboration, and the same editor is published as a React component that developers can embed in their own product. It is released under the MIT licence.

Core capabilities

  • Sketch diagrams on an infinite canvas, then export PNG, SVG or an open .excalidraw file.
  • Draw on one canvas with colleagues in the hosted app, in sessions the project describes as end-to-end encrypted.
  • Embed the editor in a React app with the @excalidraw/excalidraw package.

A hand-drawn whiteboard that exports cleanly

The editor offers an infinite canvas with rectangles, circles, diamonds, arrows, lines, free drawing and an eraser. Arrows can bind to shapes and carry labels. Images can be added, shape libraries reused, and dark mode and many interface languages are included. Drawings export to PNG, SVG or the clipboard, or as an open .excalidraw JSON file. The hosted app also works offline as a PWA and autosaves to the browser.

  • Whiteboard
  • Diagrams
  • Export
  • Shape libraries

Embed it in your own product

The editor is published on npm as @excalidraw/excalidraw and works with React 17, 18 and 19. It fills its parent container, so the container needs a height. Props such as initialData, onChange, viewModeEnabled, theme and langCode control loading, saving and appearance, and helpers export to canvas, SVG or blob. Fonts load from a CDN unless you copy them to your own path. The package does not include collaboration, so a host app must build it.

  • React
  • npm package
  • Embedding
  • Export API

Self-hosting and licence

A Docker image of the Excalidraw client serves the editor under your own domain, on Kubernetes or elsewhere, and the docs say it contains no analytics or tracking. The docs also state that a self-hosted instance does not support sharing or collaboration. The live collaboration server is a separate project, excalidraw-room, which the docs say must be set up on its own. Excalidraw is MIT licensed. Excalidraw+ is a separate paid product.

  • Docker
  • MIT licence
  • Self-hosting
  • Collaboration server

Where it fits

Use cases

  1. 01

    Sketch a process or wireframe for a meeting

    Open excalidraw.com, draw boxes, arrows and labels, and drop in images or shapes from a library. Export the result as PNG or SVG to paste into a document, or save it as an .excalidraw file to reopen later.

  2. 02

    Draw on the same canvas as a colleague

    Start a live collaboration session in the hosted app at excalidraw.com and send the link to the people you are working with. Everyone edits the same drawing at once, and the project describes the sessions as end-to-end encrypted.

  3. 03

    Add a drawing board to your own product

    Install @excalidraw/excalidraw in a React app and render the Excalidraw component inside a container with a set height. Save the drawing from the onChange callback, reload it through initialData, and export images with the built-in export functions.