A Dutch tower mill against a morning sky, blades turning into the wind. You asked Claude. Glyph drew it — from a compose spec, with the rotation animation emitted by the compiler. The same machine that drained the Netherlands powers your laptop today.
"Draw me a Dutch-style windmill. Stone tower, brown cap, four blades that rotate. Morning sky with sun and clouds, a few birds, grass at the base. Pencil-on-parchment style. The blades should actually turn — about one revolution every 8 seconds."
— what to say to your AI agent. Claude writes the Glyph compose spec; the compose compiler emits patterns, gradients, polygons, ellipses, and SMIL rotate-loop animations into one byte-locked SVG.
RFC #9 + RFC #6 (loop animations) cover the whole machine — tower, blades, sky, ground, motion.
A trapezoidal silhouette-path (4 corners + close) tapered from 80 px wide at the top to 140 at the bottom. The fill is a 12×18 stone-block pattern: three horizontal lines + two staggered verticals, reads as masonry.
Four polygons positioned at the hub. Each blade's local points are pre-rotated by 0°, 90°, 180°, 270°, then a single rotate-loop animation runs at 8 s period. Result: four sails turning together around a shared center.
Three linear/radial gradients: a sky fade from warm yellow to parchment, a sun radial-gradient circle, a grass gradient. Clouds are translucent ellipses. Birds are 3-point polylines. Wind label + arrow round out the morning.
Claude writes the compose JSON; Glyph's compose compiler turns it into byte-identical SVG. The rotate-loop animation is emitted as an SMIL <animateTransform> on each blade group.
// eng-windmill.json — the blades + rotation { "compose": { "viewBox": { "width": 800, "height": 800 }, "theme": { "preset": "pencil-parchment" }, "defs": { "patterns": [ { "id": "p-stone", "width": 18, "height": 12, "children": [ // horizontal + staggered vertical strokes ] } ], "gradients": [ /* sky, sun, ground */ ] }, "children": [ // 1. sky rect (g-sky) // 2. ground rect (g-ground) // 3. sun circle (g-sun) // 4. 3 cloud ellipses // 5. 5 bird polylines // 6. wind arrow + label // 7. tower silhouette (p-stone) // 8. door, window, cap (dome ellipse) // 9. hub disc // 10. 4 blade polygons, each with // animation: { kind: "rotate-loop", // periodMs: 8000, direction: "cw" } // 11. grass tufts (26 polylines) // 12. caption ] } }
Every blade is its own child with the same loop animation; SMIL handles the synchronization. View on GitHub.
Byte-stable across Ubuntu / macOS / Windows × Node 20 / 22. The blades rotate live in any modern browser; the static snapshot above shows the t=0 frame.
Compose extends naturally to other wind- and water-driven machines. Same primitives, different geometry.
"Draw me a modern 3-blade horizontal-axis wind turbine. Slim white tower, swept blades, against an open horizon. Show the same rotate-loop animation. Pencil-on-parchment."
"Draw me an overshot waterwheel. Stream falling onto the top of the wheel; the wheel rotates clockwise. Bucket count 16. Same pencil style."
"Draw me the four classical wind machines side by side: Dutch tower, post mill, smock mill, and Cretan-style sail mill. All to the same scale."
"Draw me a windmill on a hilltop with three farmhouses below. Show why people built mills on hilltops — wind speed scales with elevation."