The quality linter

An agent designing on a canvas fails differently than an agent writing code. The syntax is fine and the layout is wrong: text with no fill on a white card, a column that resolved to zero pixels wide, three siblings all named "Row". Brilliant checks for that automatically, in two stages, and hands the agent back a code, a sentence, and a fix.

This page is about what those checks are and why they exist. You never run them by hand; they run on every agent edit.

Two gates, not one

Blueprint's compiler runs three stages, and two of them are checks.

Parse and validate. Each line is tokenized and checked immediately, before anything touches the canvas. Wrong property for a type, missing required argument, unresolvable reference, an impossible auto layout rule. A fatal line error stops that line; a single bad property token drops just that property and the rest of the block still applies. These diagnostics carry B-prefixed codes.
Execute. Valid lines apply as real, editable elements. Auto layout recomputes, components propagate, the graph updates atomically.
Lint. After execution, the composition linter inspects the actual geometry for design-intent problems. Its diagnostics carry C-prefixed codes.

The split matters. A malformed line is caught in the abstract and never lands. A composition problem can only be seen once the layout solver has run, so it's caught on the real result.

What the composition linter catches

These are the failures that look fine line by line and wrong on screen:

Invisible text. Text with no fill defaults to white and disappears on a light background. (C201)
Collapsed elements. Anything that resolves to 0 x N or N x 0 after layout, the classic being a fill width inside a hug parent with nothing to stretch to. (C301)
Duplicate sibling names. Three elements called "Row" under one parent, usually the sign of an agent stuck in a loop. (C101)
Overflow and spill. Text that overflows its parent, or content that spills outside a clipping frame.
Stranded work. A block dropped far from everything else, off in empty canvas.

Each check runs only on the elements the agent just created or modified, so a large existing canvas doesn't slow the loop down or drown the response in noise about work nobody touched.

A diagnostic is a code, a sentence, and a fix

Every diagnostic carries a severity (error, warning, info), a category (syntax, property, layout, reference, composition), a stable code, a plain-English message, and a concrete suggestion. Three beats, meant to be read rather than just obeyed:

✓ 2 lines applied.
⚠ C301: "Image Slot" is 0×120.
        fill inside a hug parent collapses to 0. Use a fixed size, or give an ancestor a fixed width on that axis.

The validator's side looks the same, minus the canvas:

✗ 0 lines applied (1 error).
B101 (line 1): spaceBetween is only valid on the main axis (x for al(h)).
               Move sb to x(): x(sb) y(c).

Every response also carries a rendered image of what landed, so the agent sees exactly what it made next to the feedback on what went wrong. Elements arrive in streamed batches, so this fires as the design comes together rather than at the end of a long turn.

The chat panel, where an agent's diagnostics and the design land together

Why it changes the output

The compiler is built around in-context learning. A model fluent in code but new to Blueprint stumbles on an unfamiliar shape, reads the diagnostic, and writes it correctly the next time it comes up, inside the same session. Costs come down and accuracy goes up for the same reason: the agent spends tokens on decisions instead of repeating mistakes nobody named.

In practice that means most of these never reach the version you review. The agent corrects them in the same run.

What it doesn't check

The linter is about composition, not taste and not compliance. It has no opinion about whether your hierarchy reads well, whether a headline is any good, or whether a color pairing is on brand. It's not an accessibility audit either: it flags text that would be invisible, not every pair that falls short of a contrast ratio. And it checks what the agent just touched, so it isn't a whole-canvas health report you can run over old work.

The language the checks run against: The Blueprint DSL.
The full architecture story: Blueprint, the blog post.
Point your own agent at the canvas: Use with AI agents.