Customization
Strong defaults. Highly
customizable
Customize or extend nearly every part of the tldraw SDK.
Component overrides
Replace any UI element through simple prop-based component replacement without breaking functionality. Perfect for branded applications that feel completely native.
CSS variable theming
Customize colors, fonts, and spacing through semantic CSS variables, light and dark modes included. Match existing design systems without architectural conflicts.
State machine tools
Build custom interactions, multi-step operations, and precise event handling via hierarchical state machines that guide users through complex workflows.
Shape utilities
Define custom behavior through shape utility classes that handle rendering, geometry, and user interactions.
Format-specific handling
Connect shapes with automatic relationship management that survives editing, copying, and collaborative changes. Perfect for building flowcharts, org charts, and architectural diagrams.
Flexible content recognition
Register custom handlers that detect and transform any content type into application-specific shapes. Perfect for apps where pasted code becomes syntax-highlighted blocks or uploaded designs become interactive prototypes.
And so much more
You can replace or enrich shapes with your own designs, swap out UI components to match your brand, or build entirely new tools for your specific use case. The SDK provides the foundation while giving you complete control over the user experience.
Custom shapes and tools
Build shapes that fit your domain requirements. The shape system provides complete control over rendering, interaction behavior, and integration with canvas operations. Implement domain-specific interactions through custom tools and state machines. Whether you're building CAD software, design tools, or data visualization applications, tldraw’s tool system handles complex multi-step workflows.
Custom user interface components
Every interface element can be replaced, modified, or removed entirely. The component override system supports everything from subtle brand adjustments to complete interface redesigns while maintaining responsive behavior. Replace toolbars with domain-specific controls or integrate canvas operations into existing dashboards. Your custom components inherit touch optimization, keyboard navigation, and screen reader support automatically.
Custom asset and content managment
Register custom handlers that detect and transform any content type into application-specific shapes. When users paste code, drop images, or drag PDFs onto the canvas, your handlers determine what happens next. Implement custom storage backends that integrate with your existing infrastructure. The asset store interface supports cloud providers, CDNs, or local storage while handling temporary previews, upload progress, and automatic optimization for viewport performance.
Build with a starter kit
Production ready starter kit to add a chat to your canvas. Building something different?
Simplify asset handling
Support images, video, text, and custom content types without extra hassle.