Light through stone. You asked Claude. Glyph drew it — from a compose spec. Two flanking towers with pointed spires, a central rose window of stained glass, a tall central spire.
"Draw me a Gothic cathedral — front elevation. Two towers flanking a central nave. A rose window in the center. Pointed-arch windows below. A tall central spire. Smaller spires on the towers with crosses. Dawn sky."
— what to say to your AI agent. Claude writes the Glyph compose spec; the compose compiler emits one byte-locked SVG.
RFC #9's defs (gradients + patterns), shapes (silhouette-path, polygon, polyline, ellipse), and accents (glow, starfield, icon) compose the whole picture.
12 spoke polylines around a central hub, layered over a radial-gradient circle (cream center → red → blue → violet). Twelve small decorative dots circle the perimeter. The whole window is 26 children.
Two flanking tower spires + one tall central spire — each a triangle polygon (3-point). Crosses at the tip of each are silhouette-paths. The central spire is taller (28-wide base, tip at y=60).
Two tower-block silhouette-paths flank a peaked-nave silhouette. The nave's gable is a 7-point d-string with two angled shoulders. Three tall pointed-arch nave windows + two tower lancet windows are silhouette-paths with quadratic-Bézier curves.
Claude writes the compose JSON; Glyph's compose compiler turns it into byte-identical SVG.
{
"compose": {
"viewBox": { "width": 800, "height": 1000 },
"theme": { "preset": "pencil-parchment" },
"defs": {
"gradients": [
{ "id": "g-rose", "kind": "radial",
"cx": "50%", "cy": "50%", "r": "50%",
"stops": [
{ "offset": "0%", "color": "#fef3c7" },
{ "offset": "30%", "color": "#dc2626" },
{ "offset": "60%", "color": "#1d4ed8" },
{ "offset": "100%", "color": "#581c87" }
]
}
// ... g-dawn, g-stone
]
},
"children": [
// 1. dawn sky rect + ground rect
// 2. nave silhouette w/ gable peak
// 3. left + right tower silhouettes
// 4. 4 tower string-course polylines
// 5. 2 tower spires (polygon) + crosses
// 6. central tallest spire + cross
// 7. 2 lancet window silhouettes + 2 oculi
// 8. rose window: 2 circles + 12 spokes + hub + 12 dots
// 9. 3 nave arch windows + tracery mullions
// 10. doorway silhouette + arch rib + rivets
// 11. title + caption text
]
}
}
Generator script: scripts/gen-showcase-extensions.mjs · fixture: packages/core/__fixtures__/compose/arch-cathedral.json. View on GitHub.
Byte-stable across Ubuntu / macOS / Windows × Node 20 / 22. The compose compiler resolves the gradient + pattern defs first, then walks children in z-order.