State management and control
Take full programmatic control of your canvas with signals-based reactivity state system.
Key features
Key features
Key features
Key features
Type-safe data access
Query shapes, pages, and assets through a consistent API with automatic relationship management and referential integrity.
Type-safe data access
Query shapes, pages, and assets through a consistent API with automatic relationship management and referential integrity.
Type-safe data access
Query shapes, pages, and assets through a consistent API with automatic relationship management and referential integrity.
Type-safe data access
Query shapes, pages, and assets through a consistent API with automatic relationship management and referential integrity.
Reactive signals system
Track dependency automatically with fine-grained reactivity that only updates components when their specific data changes.
Reactive signals system
Track dependency automatically with fine-grained reactivity that only updates components when their specific data changes.
Reactive signals system
Track dependency automatically with fine-grained reactivity that only updates components when their specific data changes.
Reactive signals system
Track dependency automatically with fine-grained reactivity that only updates components when their specific data changes.
Computed properties
Derive new data from canvas state that updates automatically when dependencies change. Build dynamic UI panels, analytics dashboards, and custom views that stay in sync effortlessly.
Computed properties
Derive new data from canvas state that updates automatically when dependencies change. Build dynamic UI panels, analytics dashboards, and custom views that stay in sync effortlessly.
Computed properties
Derive new data from canvas state that updates automatically when dependencies change. Build dynamic UI panels, analytics dashboards, and custom views that stay in sync effortlessly.
Computed properties
Derive new data from canvas state that updates automatically when dependencies change. Build dynamic UI panels, analytics dashboards, and custom views that stay in sync effortlessly.
Real-time synchronization
Enjoy a built-in support for collaborative editing with conflict resolution and state reconciliation across multiple users and devices.
Real-time synchronization
Enjoy a built-in support for collaborative editing with conflict resolution and state reconciliation across multiple users and devices.
Real-time synchronization
Enjoy a built-in support for collaborative editing with conflict resolution and state reconciliation across multiple users and devices.
Real-time synchronization
Enjoy a built-in support for collaborative editing with conflict resolution and state reconciliation across multiple users and devices.
Reactive by design
A signals-based core handles state complexity while keeping interactions silky smooth.
Reactive by design
A signals-based core handles state complexity while keeping interactions silky smooth.
Reactive by design
A signals-based core handles state complexity while keeping interactions silky smooth.
Reactive by design
A signals-based core handles state complexity while keeping interactions silky smooth.
Engineering details
Engineering details
Engineering details
Engineering details
Atomic state management
The state system is built on a signals architecture where all data is reactive and dependencies are tracked automatically. Components and computations update only when their dependencies change, ensuring high performance even in complex canvas applications. The system automatically tracks what data each component needs and prevents unnecessary updates, keeping your application responsive as it scales.
Atomic state management
The state system is built on a signals architecture where all data is reactive and dependencies are tracked automatically. Components and computations update only when their dependencies change, ensuring high performance even in complex canvas applications. The system automatically tracks what data each component needs and prevents unnecessary updates, keeping your application responsive as it scales.
Atomic state management
The state system is built on a signals architecture where all data is reactive and dependencies are tracked automatically. Components and computations update only when their dependencies change, ensuring high performance even in complex canvas applications. The system automatically tracks what data each component needs and prevents unnecessary updates, keeping your application responsive as it scales.
Atomic state management
The state system is built on a signals architecture where all data is reactive and dependencies are tracked automatically. Components and computations update only when their dependencies change, ensuring high performance even in complex canvas applications. The system automatically tracks what data each component needs and prevents unnecessary updates, keeping your application responsive as it scales.
Normalized record storage with relationship management
All canvas data is stored in a normalized structure where shapes, pages, assets, and user preferences exist as separate record types with managed relationships. The system enforces referential integrity, applies cascading updates, and provides type-safe access to related data. This design ensures consistency, supports complex applications, and enables efficient queries.
Normalized record storage with relationship management
All canvas data is stored in a normalized structure where shapes, pages, assets, and user preferences exist as separate record types with managed relationships. The system enforces referential integrity, applies cascading updates, and provides type-safe access to related data. This design ensures consistency, supports complex applications, and enables efficient queries.
Normalized record storage with relationship management
All canvas data is stored in a normalized structure where shapes, pages, assets, and user preferences exist as separate record types with managed relationships. The system enforces referential integrity, applies cascading updates, and provides type-safe access to related data. This design ensures consistency, supports complex applications, and enables efficient queries.
Normalized record storage with relationship management
All canvas data is stored in a normalized structure where shapes, pages, assets, and user preferences exist as separate record types with managed relationships. The system enforces referential integrity, applies cascading updates, and provides type-safe access to related data. This design ensures consistency, supports complex applications, and enables efficient queries.
Transaction system with intelligent batching
The transaction system groups multiple state changes into atomic operations that can be undone or redone as a single unit. Batching prevents costly intermediate computations and creates clear history boundaries. It also supports nested transactions, custom rollback logic, and efficient bulk operations for complex workflows.
Transaction system with intelligent batching
The transaction system groups multiple state changes into atomic operations that can be undone or redone as a single unit. Batching prevents costly intermediate computations and creates clear history boundaries. It also supports nested transactions, custom rollback logic, and efficient bulk operations for complex workflows.
Transaction system with intelligent batching
The transaction system groups multiple state changes into atomic operations that can be undone or redone as a single unit. Batching prevents costly intermediate computations and creates clear history boundaries. It also supports nested transactions, custom rollback logic, and efficient bulk operations for complex workflows.
Transaction system with intelligent batching
The transaction system groups multiple state changes into atomic operations that can be undone or redone as a single unit. Batching prevents costly intermediate computations and creates clear history boundaries. It also supports nested transactions, custom rollback logic, and efficient bulk operations for complex workflows.
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.
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.
Examples
Examples
Examples
Examples
State that stays fresh
Automatic updates, dependency tracking, and smooth collaboration built in.
State that stays fresh
Automatic updates, dependency tracking, and smooth collaboration built in.
State that stays fresh
Automatic updates, dependency tracking, and smooth collaboration built in.
State that stays fresh
Automatic updates, dependency tracking, and smooth collaboration built in.
© 2025 tldraw