{"id": "visual/v01", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Draw a side view of a classic red bicycle: two wheels with spokes, frame, saddle, handlebar, pedals and chain ring, on a light background.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/v02", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Design a modern app icon: a rounded square with a vertical blue-to-purple gradient, a white stylized mountain range and a yellow sun.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/v03", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Draw a friendly cartoon cat face: ears, eyes with highlights, nose, mouth and whiskers; orange fur with darker stripes.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/v04", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Draw a small house with a red roof, a door and two windows, a tree beside it, green grass and a blue sky with two clouds.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/v05", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Design a logo for a coffee shop called 'Nova Coffee': a coffee cup whose steam forms a star, with the name in a clean font under it.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/v06", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Draw an analog clock face showing exactly 10:10: 12 hour marks, the numbers 12, 3, 6 and 9, hour and minute hands, and a red second hand pointing at 30 seconds.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/v07", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Draw a pie chart of browser market share: Chrome 65%, Safari 19%, Edge 5%, Firefox 3%, Other 8%, with distinct colors, a legend with labels and percentages, and a title.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/v08", "task": "visual", "cat": "svg", "kind": "svg", "animated": false, "prompt": "Draw a flowchart of a login process: Start -> Enter credentials -> Valid? (a diamond) -> yes: Dashboard; no: Show error -> back to Enter credentials. Use rounded boxes and arrows with arrowheads.\n\nAnswer with one complete SVG document (with xmlns and a viewBox) in a single ```svg code block. Do not use external images or fonts."}
{"id": "visual/h01", "task": "visual", "cat": "html", "kind": "html", "animated": false, "prompt": "Build a landing page for a bakery called 'Golden Crust': a navigation bar, a hero section with a headline and a call-to-action button, three product cards with prices, and a footer. Use a warm color palette.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/h02", "task": "visual", "cat": "html", "kind": "html", "animated": false, "prompt": "Build a pricing section with three plans (Basic $9/month, Pro $29/month highlighted as most popular, Enterprise $99/month), each with a feature list with check marks and a button.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/h03", "task": "visual", "cat": "html", "kind": "html", "animated": false, "prompt": "Build a centered login card on a gradient background: app title, email and password inputs with labels, a 'Remember me' checkbox, a primary sign-in button and a 'Forgot password?' link.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/h04", "task": "visual", "cat": "html", "kind": "html", "animated": false, "prompt": "Build an admin dashboard layout: a left sidebar with 5 menu items (one active), a top bar with a search field and an avatar, four KPI cards (Revenue, Users, Orders, Conversion) and a table of 5 recent orders.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/h05", "task": "visual", "cat": "html", "kind": "html", "animated": false, "prompt": "Build a responsive photo gallery grid of 12 tiles (use CSS gradients as placeholder images) with captions that appear on hover.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/h06", "task": "visual", "cat": "html", "kind": "html", "animated": false, "prompt": "Build a blog article page with good typography: title, author and date, a lead paragraph, two subheadings, a blockquote, a code snippet block and an image placeholder with a caption.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/h07", "task": "visual", "cat": "html", "kind": "html", "animated": true, "prompt": "Build a CSS-only animated loading indicator centered on the page: three bouncing dots and a circular spinner below them.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/h08", "task": "visual", "cat": "html", "kind": "html", "animated": false, "prompt": "Build a restaurant menu page with three sections (Starters, Mains, Desserts), each with 3-4 dishes with short descriptions and right-aligned prices joined by dotted leaders.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c01", "task": "visual", "cat": "canvas", "kind": "html", "animated": true, "prompt": "Make a canvas animation of 20 colorful balls bouncing off the walls with gravity and slight energy loss.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c02", "task": "visual", "cat": "canvas", "kind": "html", "animated": true, "prompt": "Make a live analog clock drawn on a canvas that shows the current time with smoothly moving hands.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c03", "task": "visual", "cat": "canvas", "kind": "html", "animated": true, "prompt": "Make a particle fountain on a canvas: particles emitted from the bottom center rise and fall with gravity, fade out, and glow (additive blending).\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c04", "task": "visual", "cat": "canvas", "kind": "html", "animated": true, "prompt": "Make Conway's Game of Life on a 60x40 grid on a canvas: random start, several updates per second, and a generation counter.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c05", "task": "visual", "cat": "canvas", "kind": "html", "animated": false, "prompt": "Draw an animated bar chart on a canvas of monthly sales (Jan 120, Feb 150, Mar 90, Apr 180, May 210, Jun 160) with axes, labels and values; the bars grow from zero when the page loads.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c06", "task": "visual", "cat": "canvas", "kind": "html", "animated": false, "prompt": "Draw a recursive fractal tree on a canvas, with branches getting thinner and greener towards the tips.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c07", "task": "visual", "cat": "canvas", "kind": "html", "animated": true, "prompt": "Make a playable Snake game on a canvas (arrow keys) with food, a score display and a game-over message; the snake moves automatically.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/c08", "task": "visual", "cat": "canvas", "kind": "html", "animated": true, "prompt": "Make a 3D starfield animation on a canvas: flying through space, stars move out from the center and grow.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Do not use external libraries."}
{"id": "visual/t01", "task": "visual", "cat": "three", "kind": "html", "animated": true, "prompt": "Make a three.js scene: a rotating cube with a standard material, lit by a directional light and an ambient light, casting a soft shadow on a ground plane.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}
{"id": "visual/t02", "task": "visual", "cat": "three", "kind": "html", "animated": true, "prompt": "Make a three.js solar system: a glowing sun and three planets of different sizes and colors orbiting at different speeds, one of them with a moon.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}
{"id": "visual/t03", "task": "visual", "cat": "three", "kind": "html", "animated": false, "prompt": "Make a three.js low-poly terrain landscape: hills from sine functions or noise, flat shading, colors by height (water, grass, rock, snow) and a sky background color.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}
{"id": "visual/t04", "task": "visual", "cat": "three", "kind": "html", "animated": true, "prompt": "Make a three.js scene with a spinning torus knot with a shiny metallic material and two colored point lights orbiting it.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}
{"id": "visual/t05", "task": "visual", "cat": "three", "kind": "html", "animated": false, "prompt": "Make a three.js 3D room seen from a corner: a floor, two walls, a table with four legs, a chair and a lamp.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}
{"id": "visual/t06", "task": "visual", "cat": "three", "kind": "html", "animated": true, "prompt": "Make a three.js spiral galaxy made of thousands of points, colored from a warm center to blue arms, slowly rotating.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}
{"id": "visual/t07", "task": "visual", "cat": "three", "kind": "html", "animated": false, "prompt": "Make a three.js snowman: three snow spheres, a carrot nose, coal eyes and buttons, stick arms and a hat, standing on snowy ground.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}
{"id": "visual/t08", "task": "visual", "cat": "three", "kind": "html", "animated": true, "prompt": "Make a three.js 3D bar chart of the values 3, 7, 5, 9, 4 as colored boxes on a grid, with the camera slowly orbiting around it.\n\nAnswer with one complete, self-contained HTML file in a single ```html code block. Put CSS and JavaScript inline. Do not use external images. Use three.js through this import map: <script type=\"importmap\">{\"imports\": {\"three\": \"https://unpkg.com/three@0.160.0/build/three.module.js\", \"three/addons/\": \"https://unpkg.com/three@0.160.0/examples/jsm/\"}}</script> and a <script type=\"module\">."}