The infinite canvas SDK
for React developers
Use the tldraw SDK to add a collaborative whiteboard to your product or use its components, runtime APIs, services to build your own canvas-based experiences on the web.
Use the tldraw SDK to add a collaborative whiteboard to your product or use its components, runtime APIs, services to build your own canvas-based experiences on the web.
We've designed the tldraw SDK to be a solid foundation for developers: built for the web, packed with table-stakes features, and designed for extensibility.
Everything on the tldraw canvas is its own React component. If you can do it on the web, you can now do it on the canvas too.
Create and edit thousands of objects. We've tuned performance for desktop, tablets, and mobile devices.
Create shared experiences with real-time collaboration, live cursors, viewport following and cursor chat. Go live with tldraw sync or bring your own backend.
Drop in images, videos, and even other websites to add them to the canvas. Paste URLs to create interactive bookmarks. Export images and data.
Create your own custom shapes, tools, and user interface. Use the runtime Editor API to drive the canvas.
Carefully considered details that turn table-stakes features into best-in-class user experience.
Create beautiful, pressure-sensitive freehand lines with the pen tool, powered by our custom algorithm for virtual ink.
Linking lines never looked so good. Customize arrowheads and create beautiful curves between shapes, notes, and more.
Switch between full light and dark mode themes that effect menus, shapes, and even image exports.
High performance in all modern browsers and on desktop, tablet, and mobile devices. Quality constantly maintained.
Install the tldraw package, import the styles, and render the component in your React app.
npm install tldrawimport { Tldraw } from 'tldraw'
import 'tldraw/tldraw.css'
export default function App() {
return <Tldraw />
}
You can use the tldraw SDK for free in your project—even in a commercial project—as long as the "Made with tldraw" watermark is present. See our license to learn more.
Want to use the tldraw SDK without our watermark? Fill out our form and we will get back to you with more information about our Business License.
Follow our quick start guide and build something today with the tldraw SDK.
Team news, product updates and deep dives from the team.
Join 1,000+ subscribers