Real-time collaborative canvas

Real-time collaboration made simple: simultaneous editing, live cursors, instant updates, and conflict-free syncing.

Key features

Key features

Key features

Key features

Collaboration UI

Implement real-time cursors, selections, chat bubbles, and viewport activity, all rendered with smooth animations.

Collaboration UI

Implement real-time cursors, selections, chat bubbles, and viewport activity, all rendered with smooth animations.

Collaboration UI

Implement real-time cursors, selections, chat bubbles, and viewport activity, all rendered with smooth animations.

Collaboration UI

Implement real-time cursors, selections, chat bubbles, and viewport activity, all rendered with smooth animations.

Live updates

Enable simultaneous editing for numerous users with a built-in conflict resolution system that keeps canvas state consistent.

Live updates

Enable simultaneous editing for numerous users with a built-in conflict resolution system that keeps canvas state consistent.

Live updates

Enable simultaneous editing for numerous users with a built-in conflict resolution system that keeps canvas state consistent.

Live updates

Enable simultaneous editing for numerous users with a built-in conflict resolution system that keeps canvas state consistent.

Viewport following

Add follow-mode to your app, letting teammates share their viewports for presentations, tours, or guided editing.

Viewport following

Add follow-mode to your app, letting teammates share their viewports for presentations, tours, or guided editing.

Viewport following

Add follow-mode to your app, letting teammates share their viewports for presentations, tours, or guided editing.

Viewport following

Add follow-mode to your app, letting teammates share their viewports for presentations, tours, or guided editing.

Access control

Define granular editor and viewer roles with APIs that plug into your existing authentication system.

Access control

Define granular editor and viewer roles with APIs that plug into your existing authentication system.

Access control

Define granular editor and viewer roles with APIs that plug into your existing authentication system.

Access control

Define granular editor and viewer roles with APIs that plug into your existing authentication system.

Session management

Use tldraw sync for automatic reconnection, multi-tab sync, and cross-device consistency with full state preservation.

Session management

Use tldraw sync for automatic reconnection, multi-tab sync, and cross-device consistency with full state preservation.

Session management

Use tldraw sync for automatic reconnection, multi-tab sync, and cross-device consistency with full state preservation.

Session management

Use tldraw sync for automatic reconnection, multi-tab sync, and cross-device consistency with full state preservation.

Distributed architecture

Power real-time collaboration at scale with up to 50 users editing together on the same canvas.

Distributed architecture

Power real-time collaboration at scale with up to 50 users editing together on the same canvas.

Distributed architecture

Power real-time collaboration at scale with up to 50 users editing together on the same canvas.

Distributed architecture

Power real-time collaboration at scale with up to 50 users editing together on the same canvas.

Multiplayer made easy

Add real-time collaboration to a tldraw canvas. Simple, fast, and powerful.

Multiplayer made easy

Add real-time collaboration to a tldraw canvas. Simple, fast, and powerful.

Multiplayer made easy

Add real-time collaboration to a tldraw canvas. Simple, fast, and powerful.

Multiplayer made easy

Add real-time collaboration to a tldraw canvas. Simple, fast, and powerful.

Engineering details

Engineering details

Engineering details

Engineering details

High-performance synchronization engine

Our collaboration system runs on tldraw sync, a production-grade real-time synchronization engine. This engine was specifically optimized for canvas interactions to ensure that drawing strokes, shape manipulations, and text edits are in sync across all users with almost no delay. When users work on the same element, it keeps separate layers for confirmed server data and pending edits, resolving conflicts automatically.

High-performance synchronization engine

Our collaboration system runs on tldraw sync, a production-grade real-time synchronization engine. This engine was specifically optimized for canvas interactions to ensure that drawing strokes, shape manipulations, and text edits are in sync across all users with almost no delay. When users work on the same element, it keeps separate layers for confirmed server data and pending edits, resolving conflicts automatically.

High-performance synchronization engine

Our collaboration system runs on tldraw sync, a production-grade real-time synchronization engine. This engine was specifically optimized for canvas interactions to ensure that drawing strokes, shape manipulations, and text edits are in sync across all users with almost no delay. When users work on the same element, it keeps separate layers for confirmed server data and pending edits, resolving conflicts automatically.

High-performance synchronization engine

Our collaboration system runs on tldraw sync, a production-grade real-time synchronization engine. This engine was specifically optimized for canvas interactions to ensure that drawing strokes, shape manipulations, and text edits are in sync across all users with almost no delay. When users work on the same element, it keeps separate layers for confirmed server data and pending edits, resolving conflicts automatically.

Scalable room distribution system

Each collaborative canvas runs on its own Durable Object instance, creating a dedicated mini-server that can handle up to 50 simultaneous collaborators. This architecture eliminates scaling bottlenecks by distributing load across individual canvas instances, with Cloudflare automatically managing instance creation, routing, and geographic distribution for optimal performance.

Scalable room distribution system

Each collaborative canvas runs on its own Durable Object instance, creating a dedicated mini-server that can handle up to 50 simultaneous collaborators. This architecture eliminates scaling bottlenecks by distributing load across individual canvas instances, with Cloudflare automatically managing instance creation, routing, and geographic distribution for optimal performance.

Scalable room distribution system

Each collaborative canvas runs on its own Durable Object instance, creating a dedicated mini-server that can handle up to 50 simultaneous collaborators. This architecture eliminates scaling bottlenecks by distributing load across individual canvas instances, with Cloudflare automatically managing instance creation, routing, and geographic distribution for optimal performance.

Scalable room distribution system

Each collaborative canvas runs on its own Durable Object instance, creating a dedicated mini-server that can handle up to 50 simultaneous collaborators. This architecture eliminates scaling bottlenecks by distributing load across individual canvas instances, with Cloudflare automatically managing instance creation, routing, and geographic distribution for optimal performance.

Cross-Device state synchronization

Comprehensive synchronization extends beyond real-time editing to support multi-tab consistency and seamless device handoff. Camera position and UI preferences sync automatically across browser sessions. Users transition effortlessly between desktop, tablet, and mobile devices with automatic state recovery and reconnection logic.

Cross-Device state synchronization

Comprehensive synchronization extends beyond real-time editing to support multi-tab consistency and seamless device handoff. Camera position and UI preferences sync automatically across browser sessions. Users transition effortlessly between desktop, tablet, and mobile devices with automatic state recovery and reconnection logic.

Cross-Device state synchronization

Comprehensive synchronization extends beyond real-time editing to support multi-tab consistency and seamless device handoff. Camera position and UI preferences sync automatically across browser sessions. Users transition effortlessly between desktop, tablet, and mobile devices with automatic state recovery and reconnection logic.

Cross-Device state synchronization

Comprehensive synchronization extends beyond real-time editing to support multi-tab consistency and seamless device handoff. Camera position and UI preferences sync automatically across browser sessions. Users transition effortlessly between desktop, tablet, and mobile devices with automatic state recovery and reconnection logic.

Asset handling and storage integration

Large assets like images and videos are handled separately from real-time synchronization to maintain performance. Files are uploaded to cloud storage (R2) and cached on Cloudflare's edge network. In this way, loading is fast worldwide, and WebSocket connections stay focused on lightweight canvas interactions data.

Asset handling and storage integration

Large assets like images and videos are handled separately from real-time synchronization to maintain performance. Files are uploaded to cloud storage (R2) and cached on Cloudflare's edge network. In this way, loading is fast worldwide, and WebSocket connections stay focused on lightweight canvas interactions data.

Asset handling and storage integration

Large assets like images and videos are handled separately from real-time synchronization to maintain performance. Files are uploaded to cloud storage (R2) and cached on Cloudflare's edge network. In this way, loading is fast worldwide, and WebSocket connections stay focused on lightweight canvas interactions data.

Asset handling and storage integration

Large assets like images and videos are handled separately from real-time synchronization to maintain performance. Files are uploaded to cloud storage (R2) and cached on Cloudflare's edge network. In this way, loading is fast worldwide, and WebSocket connections stay focused on lightweight canvas interactions data.

Multiplayer starter kit

Self-hosted tldraw with real-time multiplayer collaboration built with Cloudflare Durable Objects. Production-ready backend that handles WebSocket connections, automatic persistence, and asset management. The same architecture that powers hundreds of thousands of collaborative sessions on tldraw.com.

Multiplayer starter kit

Self-hosted tldraw with real-time multiplayer collaboration built with Cloudflare Durable Objects. Production-ready backend that handles WebSocket connections, automatic persistence, and asset management. The same architecture that powers hundreds of thousands of collaborative sessions on tldraw.com.

Agent starter kit

Give your AI agents visual superpowers. Allow them to read drawings, generate diagrams, and interact with canvas elements just like human users. You handle the AI integration, tldraw handles the complex canvas interactions, shape recognition, and visual rendering.

Agent starter kit

Give your AI agents visual superpowers. Allow them to read drawings, generate diagrams, and interact with canvas elements just like human users. You handle the AI integration, tldraw handles the complex canvas interactions, shape recognition, and visual rendering.

Showcase

Showcase

Showcase

Showcase

Drawing with friends

Bring people together on a tldraw canvas in real time.

Drawing with friends

Bring people together on a tldraw canvas in real time.

Drawing with friends

Bring people together on a tldraw canvas in real time.

Drawing with friends

Bring people together on a tldraw canvas in real time.

Product

Developers

Resources

Product

Developers

Resources

Product

Developers

Resources

Product

Developers

Resources