# tldraw: An Infinite Canvas SDK for React Applications

This repository profile is provided by osrepos.com, an open source repository discovery platform.

Source: osrepos.com
Repository profile: https://osrepos.com/repo/tldraw-tldraw
Generated for open source discovery and AI-assisted research.

tldraw is a powerful open-source SDK for building infinite canvas applications in React. It provides a feature-complete engine for whiteboarding, drawing, and diagramming, supporting real-time collaboration and extensive customization. Developers can leverage its rich API and starter kits to create highly interactive and extensible canvas experiences.

GitHub: https://github.com/tldraw/tldraw
OSRepos URL: https://osrepos.com/repo/tldraw-tldraw

## Summary

tldraw is a powerful open-source SDK for building infinite canvas applications in React. It provides a feature-complete engine for whiteboarding, drawing, and diagramming, supporting real-time collaboration and extensive customization. Developers can leverage its rich API and starter kits to create highly interactive and extensible canvas experiences.

## Topics

- canvas
- react
- sdk
- whiteboard
- multiplayer
- typescript
- frontend
- drawing

## Repository Information

Last analyzed by OSRepos: Thu May 07 2026 01:32:15 GMT+0100 (Western European Summer Time)
Detail views: 7
GitHub clicks: 3

## Safety Notice

OSRepos shares public repositories for knowledge and discovery only. Review source code, dependencies, licenses, and security implications before running or installing anything.

## Content

## Introduction

tldraw is a robust SDK designed for creating infinite canvas applications within React. It offers a comprehensive engine for building whiteboards, drawing tools, and diagramming solutions, emphasizing extensibility and real-time collaboration. With tldraw, developers gain access to a powerful foundation for highly interactive web applications.

## Installation

Getting started with tldraw is straightforward. You can install the package using npm:

bash
npm i tldraw


## Examples

Integrate tldraw into your React application with minimal effort. Here's a basic example:

tsx
import { Tldraw } from 'tldraw'
import 'tldraw/tldraw.css'

export default function App() {
	return (
		<div style={{ position: 'fixed', inset: 0 }}>
			<Tldraw />
		</div>
	)
}


For more advanced use cases and pre-built solutions, tldraw offers various starter kits. These kits provide custom shapes, tools, and UI components for common applications like multiplayer whiteboards, AI agents, and workflow builders. You can initialize a new project with a starter kit using:

bash
npx create-tldraw@latest


## Why Use tldraw?

tldraw stands out with its rich feature set and flexibility:

*   **Multiplayer Capabilities**: Easily integrate self-hostable real-time collaboration using `@tldraw/sync`, enabling shared canvas experiences.
*   **Extensive Drawing and Diagramming Tools**: Offers pressure-sensitive drawing, geometric shapes, rich text, arrows, snapping, image/video support, and image export.
*   **Fully Extensible Architecture**: Customize every aspect, including shapes, tools, bindings, and UI components, to fit specific application needs.
*   **AI Integrations**: Provides canvas primitives specifically designed for building applications with Large Language Models (LLMs).
*   **Broad Device Support**: Works seamlessly across various browsers, desktop, touch screens, tablets, and mobile devices.

## Links

*   **GitHub Repository**: [https://github.com/tldraw/tldraw](https://github.com/tldraw/tldraw)
*   **Official Documentation**: [https://tldraw.dev/quick-start](https://tldraw.dev/quick-start)
*   **Examples**: [https://tldraw.dev/examples](https://tldraw.dev/examples)
*   **Discord Community**: [https://discord.tldraw.com](https://discord.tldraw.com)