Canvas

A canvas is interactive HTML the kid plays inside a task. Mini-games, math drills, drawing tools, sticker boards, narrated stories, anything you can render. When text isn't enough, you reach for a canvas.

Canvases run in a strict sandbox. The auto-injected sprout.* SDK is the only host bridge: no fetch, no external <script src>, no localStorage. This is what lets a parent trust a canvas they didn't write line-by-line.

Where you'll see this

In the wild: Author a canvas (Build)

Shape

name · emoji: what shows up in choosers.
html: the canvas body. Gets wrapped with the Sprout design-system stylesheet + SproutBridge shim unless injectBaseStyles: false.
completionSchema: what counts as done. The canvas calls one of sprout.score / sprout.complete / sprout.timed to signal completion.
dimensions: at minimum the age axis (e.g. { age: "5-7" }). Immutable post-create.

A worked example

A sight-word race canvas, dry-run first.

Shell

canvas.create({
name: "Sight word race",
emoji: "🏃",
html: "<!-- canvas body uses sprout.* SDK; see canvas/sdk resource -->",
completionSchema: { kind: "score", maxScore: 100 },
dimensions: { age: "5-7" },
dryRun: true
})
# Returns: { previewHtml, analyzerIssues, specHash }
# Show preview to parent, then commit with dryRun:false + same specHash.

Once committed, wrap in a skill (skill.write { canvasIds: [<canvasId>] }) and deliver via task.create with runMode: "canvas" + canvasSpec.canvasId.

The SDK contract

The canvas talks to the host only through the auto-injected sprout.* SDK. The contract lives at the MCP resource sprout://canvas/sdk; read it before you author HTML.

Highlights:

State and identity: sprout.whoami(), sprout.history().
Assets: sprout.getAsset(). sprout.uploadAsset() ships Soon.
Avatar reactions: sprout.signal() mid-activity events , celebration, attempt-failed, user-stuck, etc.
Completion: mandatory single call , sprout.score(), sprout.complete(), or sprout.timed().

When to use it (and when not to)

Use a canvas when:

The kid is doing something interactive (a game, a drawing, a drill).
You need visual structure beyond a chat message.
Completion depends on a structured artifact (a score, a timed result, a captured photo).

Stick with a conversation task when:

The kid is sharing, reflecting, or being coached. Chat is the right surface.
You'd be building a custom UI just to render words.

Common errors

BAD_INPUT · SAFETY_REJECTED: content failed the platform safety check.
BAD_INPUT · INVALID_DIMENSION_VALUE: empty or whitespace-only dimension axis value.
BAD_INPUT · SPEC_HASH_MISMATCH: input drifted between dry-run and commit.
DOMAIN_NOT_FOUND , canvas.get on a canvas not in this family.

Related tools

canvas.create: author. Supports dryRun + specHash.
canvas.update: edit. Partial. Dimensions are immutable.
canvas.list: paginated; omits HTML body.
canvas.get: full body including HTML and completion schema.

Roadmap for this noun

Soon sprout.uploadAsset: photo and video capture inside a canvas. Asset becomes part of the task's completion proof.
Soon Storage-backed canvases: persistent kid-scoped state. Save progress across sessions; build on what came before.
Soon Shared-canvas multi-kid: same canvas, multiple kids working simultaneously.

Author a canvas Task Skill

Was this page helpful?