Composable primitives for infinite canvas
tldraw provides reliable primitives that work independently or together. Each system handles the complex infrastructure while exposing clean APIs for customization and extension.
Every infinite canvas application requires the same core set of primitives, regardless of your specific use case. These undifferentiated but crucial systems have significant implications for user experience, performance, and scalability. They take months to build correctly but often don't directly contribute to your core value proposition. That's why tldraw takes care of that part.
The tldraw sync system takes care of conflict resolution, presence tracking, and connection management. Users get real-time collaboration with shared cursors, live selections, and smooth conflict handling. Developers get production-ready WebSocket adapters, offline support, and automatic reconnection without having to build them from scratch.
Learn more
The tldraw sync system takes care of conflict resolution, presence tracking, and connection management. Users get real-time collaboration with shared cursors, live selections, and smooth conflict handling. Developers get production-ready WebSocket adapters, offline support, and automatic reconnection without having to build them from scratch.
Learn more
The tldraw sync system takes care of conflict resolution, presence tracking, and connection management. Users get real-time collaboration with shared cursors, live selections, and smooth conflict handling. Developers get production-ready WebSocket adapters, offline support, and automatic reconnection without having to build them from scratch.
Learn more
The tldraw sync system takes care of conflict resolution, presence tracking, and connection management. Users get real-time collaboration with shared cursors, live selections, and smooth conflict handling. Developers get production-ready WebSocket adapters, offline support, and automatic reconnection without having to build them from scratch.
Learn more
Pointer movements, gestures, and key presses are translated into precise, responsive actions on the canvas. The event system runs on a state machine that scales from simple tools to complex multi-step workflows. Developers can build custom drawing tools, domain-specific interactions, or entirely new input paradigms, while the foundation handles hit testing, coordinate transforms, and gesture recognition.
Learn more
Pointer movements, gestures, and key presses are translated into precise, responsive actions on the canvas. The event system runs on a state machine that scales from simple tools to complex multi-step workflows. Developers can build custom drawing tools, domain-specific interactions, or entirely new input paradigms, while the foundation handles hit testing, coordinate transforms, and gesture recognition.
Learn more
Pointer movements, gestures, and key presses are translated into precise, responsive actions on the canvas. The event system runs on a state machine that scales from simple tools to complex multi-step workflows. Developers can build custom drawing tools, domain-specific interactions, or entirely new input paradigms, while the foundation handles hit testing, coordinate transforms, and gesture recognition.
Learn more
Pointer movements, gestures, and key presses are translated into precise, responsive actions on the canvas. The event system runs on a state machine that scales from simple tools to complex multi-step workflows. Developers can build custom drawing tools, domain-specific interactions, or entirely new input paradigms, while the foundation handles hit testing, coordinate transforms, and gesture recognition.
Learn more
The reactive store handles automatic subscriptions, efficient updates, and type-safe operations across your entire canvas. Changes flow instantly through computed values and side effects, while schema migrations take care of data evolution. From UI updates to multiplayer sync, everything stays consistent without extra work.
Learn more
The reactive store handles automatic subscriptions, efficient updates, and type-safe operations across your entire canvas. Changes flow instantly through computed values and side effects, while schema migrations take care of data evolution. From UI updates to multiplayer sync, everything stays consistent without extra work.
Learn more
The reactive store handles automatic subscriptions, efficient updates, and type-safe operations across your entire canvas. Changes flow instantly through computed values and side effects, while schema migrations take care of data evolution. From UI updates to multiplayer sync, everything stays consistent without extra work.
Learn more
The reactive store handles automatic subscriptions, efficient updates, and type-safe operations across your entire canvas. Changes flow instantly through computed values and side effects, while schema migrations take care of data evolution. From UI updates to multiplayer sync, everything stays consistent without extra work.
Learn more
The camera system delivers smooth zooming, infinite panning, and precise coordinates for fluid navigation. It manages viewport culling, coordinate transforms, and animation timing automatically. Users can move naturally with touch, mouse, or keyboard, while developers get viewport bounds, coordinate conversion utilities, and deep linking for shareable views.
Learn more
The camera system delivers smooth zooming, infinite panning, and precise coordinates for fluid navigation. It manages viewport culling, coordinate transforms, and animation timing automatically. Users can move naturally with touch, mouse, or keyboard, while developers get viewport bounds, coordinate conversion utilities, and deep linking for shareable views.
Learn more
The camera system delivers smooth zooming, infinite panning, and precise coordinates for fluid navigation. It manages viewport culling, coordinate transforms, and animation timing automatically. Users can move naturally with touch, mouse, or keyboard, while developers get viewport bounds, coordinate conversion utilities, and deep linking for shareable views.
Learn more
The camera system delivers smooth zooming, infinite panning, and precise coordinates for fluid navigation. It manages viewport culling, coordinate transforms, and animation timing automatically. Users can move naturally with touch, mouse, or keyboard, while developers get viewport bounds, coordinate conversion utilities, and deep linking for shareable views.
Learn more
The geometry system computes bounds automatically, snaps objects into place intelligently, and keeps layouts precise. Behind the scenes it runs the vector math, transformation matrices, and collision detection required for accurate spatial operations. Use it to build alignment guides, automatic layout engines, or measurement tools without re-implementing the core math yourself.
Learn more
The geometry system computes bounds automatically, snaps objects into place intelligently, and keeps layouts precise. Behind the scenes it runs the vector math, transformation matrices, and collision detection required for accurate spatial operations. Use it to build alignment guides, automatic layout engines, or measurement tools without re-implementing the core math yourself.
Learn more
The geometry system computes bounds automatically, snaps objects into place intelligently, and keeps layouts precise. Behind the scenes it runs the vector math, transformation matrices, and collision detection required for accurate spatial operations. Use it to build alignment guides, automatic layout engines, or measurement tools without re-implementing the core math yourself.
Learn more
The geometry system computes bounds automatically, snaps objects into place intelligently, and keeps layouts precise. Behind the scenes it runs the vector math, transformation matrices, and collision detection required for accurate spatial operations. Use it to build alignment guides, automatic layout engines, or measurement tools without re-implementing the core math yourself.
Learn more
Users can select multiple shapes, drag handles to resize or rotate, and apply batch operations with familiar keyboard modifiers. The system manages visual feedback and precise transformation controls automatically. As a developer, you can extend it with custom selection behaviors, specialized transformation tools, or domain-specific manipulation interfaces, while the primitives take care of the complex interaction logic.
Learn more
Users can select multiple shapes, drag handles to resize or rotate, and apply batch operations with familiar keyboard modifiers. The system manages visual feedback and precise transformation controls automatically. As a developer, you can extend it with custom selection behaviors, specialized transformation tools, or domain-specific manipulation interfaces, while the primitives take care of the complex interaction logic.
Learn more
Users can select multiple shapes, drag handles to resize or rotate, and apply batch operations with familiar keyboard modifiers. The system manages visual feedback and precise transformation controls automatically. As a developer, you can extend it with custom selection behaviors, specialized transformation tools, or domain-specific manipulation interfaces, while the primitives take care of the complex interaction logic.
Learn more
Users can select multiple shapes, drag handles to resize or rotate, and apply batch operations with familiar keyboard modifiers. The system manages visual feedback and precise transformation controls automatically. As a developer, you can extend it with custom selection behaviors, specialized transformation tools, or domain-specific manipulation interfaces, while the primitives take care of the complex interaction logic.
Learn more
Screen reader support, keyboard navigation, and semantic shape descriptions make canvas apps usable for everyone. The accessibility system provides context-aware announcements and full keyboard control, while handling ARIA roles, focus management, and reading order automatically. You can meet compliance requirements without giving up rich interactions.
Learn more
Screen reader support, keyboard navigation, and semantic shape descriptions make canvas apps usable for everyone. The accessibility system provides context-aware announcements and full keyboard control, while handling ARIA roles, focus management, and reading order automatically. You can meet compliance requirements without giving up rich interactions.
Learn more
Screen reader support, keyboard navigation, and semantic shape descriptions make canvas apps usable for everyone. The accessibility system provides context-aware announcements and full keyboard control, while handling ARIA roles, focus management, and reading order automatically. You can meet compliance requirements without giving up rich interactions.
Learn more
Screen reader support, keyboard navigation, and semantic shape descriptions make canvas apps usable for everyone. The accessibility system provides context-aware announcements and full keyboard control, while handling ARIA roles, focus management, and reading order automatically. You can meet compliance requirements without giving up rich interactions.
Learn more
Every UI component can be customized or replaced. The system provides responsive layouts, theme support, and full override capabilities while keeping behavior consistent across screen sizes. You can build white-label apps, design custom tool palettes, or create industry-specific interfaces. The UI primitives handle responsiveness and accessibility, giving you full control over design.
Learn more
Every UI component can be customized or replaced. The system provides responsive layouts, theme support, and full override capabilities while keeping behavior consistent across screen sizes. You can build white-label apps, design custom tool palettes, or create industry-specific interfaces. The UI primitives handle responsiveness and accessibility, giving you full control over design.
Learn more
Every UI component can be customized or replaced. The system provides responsive layouts, theme support, and full override capabilities while keeping behavior consistent across screen sizes. You can build white-label apps, design custom tool palettes, or create industry-specific interfaces. The UI primitives handle responsiveness and accessibility, giving you full control over design.
Learn more
Every UI component can be customized or replaced. The system provides responsive layouts, theme support, and full override capabilities while keeping behavior consistent across screen sizes. You can build white-label apps, design custom tool palettes, or create industry-specific interfaces. The UI primitives handle responsiveness and accessibility, giving you full control over design.
Learn more
Start building with primitives
Extend, override, and combine our primitives to create the canvas experience your app needs.
Start building with primitives
Extend, override, and combine our primitives to create the canvas experience your app needs.
Start building with primitives
Extend, override, and combine our primitives to create the canvas experience your app needs.
Start building with primitives
Extend, override, and combine our primitives to create the canvas experience your app needs.
© 2025 tldraw