<!-- mobian-agent-page publisher="dailydev" canonical="https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a" -->

---
title: Agent Draw: An agent draws while you talk, built on TLDraw
description: Agent Draw is a tool built on tldraw's Agent starter kit that lets an AI agent draw on an infinite canvas while you speak. You drag a rectangle to define a...
canonical: https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a
twitter:card: summary_large_image
twitter:site: @dailydotdev
og:type: website
og:site_name: daily.dev
og:title: Agent Draw: An agent draws while you talk, built on TLDraw | daily.dev
og:description: Agent Draw is a tool built on tldraw's Agent starter kit that lets an AI agent draw on an infinite canvas while you speak. You drag a rectangle to define a...
og:url: https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a
og:image: https://api.daily.dev/og/posts/cZix0PD0A.png
og:image:alt: Agent Draw: An agent draws while you talk, built on TLDraw
og:image:width: 1200
og:image:height: 630
og:locale: en
---

> ## Documentation Index
> Fetch the complete documentation index at: https://daily.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Agent Draw: An agent draws while you talk, built on TLDraw

**[Hacker News](https://daily.dev/sources/hn)** · 8 min read · 1 upvotes · 0 comments

## Summary

Agent Draw is a tool built on tldraw's Agent starter kit that lets an AI agent draw on an infinite canvas while you speak. You drag a rectangle to define a region, describe what you want verbally, and the agent renders it using tldraw primitives or the pen tool. The post covers the full implementation: a custom StateNode tool for region capture, a MediaRecorder-based audio pipeline, Mistral Voxtral for transcription via a Cloudflare Worker, a FIFO queue to serialize multiple concurrent draw requests, and prompt engineering to prevent the model from dumping text instead of drawing. Performance was improved by removing two actions (setMyView and review) from the agent's working mode, roughly halving round-trips per capture. Model capability comparisons show claude-opus-4.8 producing richer compositions than smaller models like claude-haiku-4.5 or gemini-2.5-flash-lite.

## Full article

daily.dev links to this article rather than hosting it. Read it at the original source: <https://techstackups.com/articles/tldraw-agent-draw>

## Questions this post answers

### How do you make a tldraw agent finish an entire drawing instead of stopping after one shape?

Use the starter kit's full agentic loop, agent.prompt, instead of the single-turn agent.request. Prompt keeps taking turns automatically until the model has nothing left to add, so it completes the whole drawing in one call. A hand-rolled continue-loop with extra linter passes became unnecessary once this was confirmed and was deleted.

_Developers wiring up multi-step agent loops can compare implementation approaches like this on daily.dev._

### How can I speed up an AI agent that draws on a canvas using tldraw's starter kit?

Remove the setMyView and review actions from the working mode's action list when doing fixed-region drawing. setMyView moves the camera and triggers an extra round-trip, while review runs a lint pass and schedules a follow-up turn; cutting both roughly halved the number of model calls per capture, with only a two-line change in AgentModeDefinitions.ts.

_Engineers tuning agent latency and cost can track practical fixes like this on daily.dev._

### How well do different Claude and Gemini models perform when asked to draw on an infinite canvas with an AI agent?

Claude Opus 4.5 handles both a decision diagram and a fully realized cricket scene well, using the pen tool for dynamic sketches. Claude Haiku 4.5 matches Opus on the diagram but settles for a simpler static composition with a label instead of a pen sketch for cricket. Google's Gemini 2.5 Flash Lite appears to give up early on both requests.

_Teams deciding which model to power an agentic canvas feature can weigh comparisons like this on daily.dev._

## Similar posts on daily.dev

- [Claude Design is the best feature Anthropic's launched in a while, but it has some serious limitations](https://daily.dev/posts/claude-design-is-the-best-feature-anthropic-s-launched-in-a-while-but-it-has-some-serious-limitatio-zigjhcpob) · XDA Developers · 1 upvotes · 0 comments

---

Tags: [#ai-agents](https://daily.dev/tags/ai-agents), [#cloudflare](https://daily.dev/tags/cloudflare), [#speech-recognition](https://daily.dev/tags/speech-recognition)

[View this post on daily.dev](https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a)

```json
{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]}
{"@context":"https://schema.org","@type":"TechArticle","headline":"Agent Draw: An agent draws while you talk, built on TLDraw","url":"https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a"},"datePublished":"2026-07-12T23:11:32.929Z","dateModified":"2026-09-14T08:56:17.897Z","description":"Agent Draw is a tool built on tldraw's Agent starter kit that lets an AI agent draw on an infinite canvas while you speak. You drag a rectangle to define a...","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d2570b7344dbee867b32df3e35d92ed4?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d2570b7344dbee867b32df3e35d92ed4?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"Hacker News","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Hacker News","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1/logos/hn","url":"https://daily.dev/sources/hn"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":1},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"ai-agents,cloudflare,speech-recognition","timeRequired":"PT8M"}
{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Hacker News","item":"https://daily.dev/sources/hn"},{"@type":"ListItem","position":3,"name":"Agent Draw: An agent draws while you talk, built on TLDraw"}]}
{"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/agent-draw-an-agent-draws-while-you-talk-built-on-tldraw-czix0pd0a#faq","mainEntity":[{"@type":"Question","name":"How do you make a tldraw agent finish an entire drawing instead of stopping after one shape?","acceptedAnswer":{"@type":"Answer","text":"Use the starter kit's full agentic loop, agent.prompt, instead of the single-turn agent.request. Prompt keeps taking turns automatically until the model has nothing left to add, so it completes the whole drawing in one call. A hand-rolled continue-loop with extra linter passes became unnecessary once this was confirmed and was deleted. Developers wiring up multi-step agent loops can compare implementation approaches like this on daily.dev."}},{"@type":"Question","name":"How can I speed up an AI agent that draws on a canvas using tldraw's starter kit?","acceptedAnswer":{"@type":"Answer","text":"Remove the setMyView and review actions from the working mode's action list when doing fixed-region drawing. setMyView moves the camera and triggers an extra round-trip, while review runs a lint pass and schedules a follow-up turn; cutting both roughly halved the number of model calls per capture, with only a two-line change in AgentModeDefinitions.ts. Engineers tuning agent latency and cost can track practical fixes like this on daily.dev."}},{"@type":"Question","name":"How well do different Claude and Gemini models perform when asked to draw on an infinite canvas with an AI agent?","acceptedAnswer":{"@type":"Answer","text":"Claude Opus 4.5 handles both a decision diagram and a fully realized cricket scene well, using the pen tool for dynamic sketches. Claude Haiku 4.5 matches Opus on the diagram but settles for a simpler static composition with a label instead of a pen sketch for cricket. Google's Gemini 2.5 Flash Lite appears to give up early on both requests. Teams deciding which model to power an agentic canvas feature can weigh comparisons like this on daily.dev."}}]}
```

