# excalidraw-animate

**Repository Path**: limetest/excalidraw-animate

## Basic Information

- **Project Name**: excalidraw-animate
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-07-02
- **Last Updated**: 2025-07-02

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# excalidraw-animate

<table><tr><td>
<img alt="excalidraw-animate" src="https://user-images.githubusercontent.com/490574/83698750-332ca080-a63d-11ea-9845-d2442e9b4305.gif" width="50%" />
</td></tr></table>

## What is this

This is an external tool to convert an
[Excalidraw](https://excalidraw.com) drawing
into animation.

## How to use it

Visit: <https://dai-shi.github.io/excalidraw-animate>

### Using a local file

1. Save as a file in Excalidraw

<table><tr><td>
<img alt="Save icon image" src="https://user-images.githubusercontent.com/490574/85708882-9f239580-b71f-11ea-8faa-4aed086fd490.png" width="50%" />
</td></tr></table>

2. Load the file in Excalidraw Animate

<table><tr><td>
<img alt="Load icon image" src="https://user-images.githubusercontent.com/490574/85709345-1fe29180-b720-11ea-84dc-aca7267f3a98.png" width="50%" />
</td></tr></table>

### Using a shareable link

1. Create a shareable link in Excalidraw

<table><tr><td>
<img alt="Shareable link image" src="https://pbs.twimg.com/media/EYsiegqUwAAmmfE?format=png&name=small" width="50%" />
</td></tr></table>

2. Enter the link in the field and click "Animate!"

<table><tr><td>
<img alt="Text field image" src="https://pbs.twimg.com/media/EY0ZbMjUcAAcBSh?format=png&name=900x900" width="50%" />
</td></tr></table>

This also works for Excalidraw Library links.

## Known issues

- Exporting WebM feature is not perfect. Please use screen capture if that doesn't work as expected.

## Package

It's also provided as a package:
<https://www.npmjs.com/package/excalidraw-animate>

## Tweets

- [The first one with arrows](https://twitter.com/dai_shi/status/1261683775924105218)
- [Public URL for trial](https://twitter.com/dai_shi/status/1263103554631249923)
- [Real example with lines](https://twitter.com/dai_shi/status/1263230421715714049)
- [Free draw example](https://twitter.com/dai_shi/status/1263237733067091968)
- [Text example](https://twitter.com/dai_shi/status/1263451555858010115)
- [All shapes example](https://twitter.com/dai_shi/status/1263873223726231552)
- [Real example with better timing](https://twitter.com/dai_shi/status/1264056453880377345)
- [Pause and resume](https://twitter.com/dai_shi/status/1264105261800669184)
- [Export svg and webm](https://twitter.com/dai_shi/status/1264194079165779970)
- [Adding text field](https://twitter.com/dai_shi/status/1264695085871947776)
- [Grouping support](https://twitter.com/dai_shi/status/1265441085641256960)
- [Embedding example](https://twitter.com/dai_shi/status/1269787031892160512)
- [Load local file](https://twitter.com/dai_shi/status/1271802345106489345)
- [Keyboard shortcut](https://twitter.com/dai_shi/status/1280118714470330368)
- [Support for libraries](https://twitter.com/dai_shi/status/1334851951339528202)
- [Support round rectangles](https://twitter.com/dai_shi/status/1338830468817461249)
- [Support background color](https://twitter.com/dai_shi/status/1343324961650343937)
- [Improved WebM export](https://twitter.com/dai_shi/status/1344935241668988930)
- [Grid layout for libraries](https://twitter.com/dai_shi/status/1352229139500044296)
- [Support arrowheads](https://twitter.com/dai_shi/status/1364184618371411971)
- [Step through animations](https://twitter.com/dai_shi/status/1376930624804560900)
- [Support freedraw](https://twitter.com/dai_shi/status/1391770531582537734)
- [NPM package](https://twitter.com/dai_shi/status/1398600356322451456)
- [Support images](https://twitter.com/dai_shi/status/1453012946129338368)
- [Support filled arrow cap](https://twitter.com/dai_shi/status/1453732212478644231)
- [Excalidraw v0.11.0](https://twitter.com/dai_shi/status/1494672036459081730)
- [Excalidraw v0.12.0](https://twitter.com/dai_shi/status/1561928834198704128)
- [Excalidraw v0.15.2](https://twitter.com/dai_shi/status/1654112716037185536)

## Other projects with Excalidraw

- [Excalidraw Gallery](https://github.com/dai-shi/excalidraw-gallery)
- [Excalidraw Claymate](https://github.com/dai-shi/excalidraw-claymate)
- [Excalidraw Layers](https://github.com/dai-shi/excalidraw-layers)