{
 "name": "Specimens",
 "url": "https://specimens.llmvuln.xyz/",
 "description": "A growing catalogue of live web interaction effects (animations, transitions, physics, generative graphics, type and interface details) in plain HTML, CSS and JavaScript, with no libraries. Every specimen is one self-contained HTML file, free to copy under the Unlicense or MIT-0, with no credit needed.",
 "license": "Unlicense OR MIT-0",
 "attribution_required": false,
 "instructions": "https://specimens.llmvuln.xyz/agents.md",
 "families": [
  {
   "id": "depth",
   "numeral": "I",
   "title": "Depth & light",
   "about": "Perspective, layers and light: flat screens pretending to have a third dimension.",
   "specimens": [
    "parallax",
    "foil",
    "carousel",
    "sphere",
    "extrude",
    "explode",
    "halftone",
    "fold",
    "focus",
    "die",
    "shadows",
    "lens",
    "iso",
    "lenticular",
    "solids",
    "shafts",
    "curl",
    "room",
    "terrain"
   ]
  },
  {
   "id": "physics",
   "numeral": "II",
   "title": "Physics",
   "about": "Springs, gravity and pressure, worked out one frame at a time.",
   "specimens": [
    "field",
    "goo",
    "boids",
    "cloth",
    "slosh",
    "harp",
    "orbits",
    "jelly",
    "cradle",
    "ballpit",
    "filings",
    "double",
    "fluid",
    "grass",
    "buoyancy",
    "gears",
    "magnets",
    "fireworks",
    "pendulum"
   ]
  },
  {
   "id": "math",
   "numeral": "III",
   "title": "Simulation & math",
   "about": "Fields, automata and transforms where simple rules draw complicated pictures.",
   "specimens": [
    "ribbons",
    "sand",
    "epicycles",
    "contours",
    "voronoi",
    "zoom",
    "life",
    "rd",
    "harmonograph",
    "lorenz",
    "tree",
    "flow",
    "julia",
    "maze",
    "packing",
    "galton",
    "ripples"
   ]
  },
  {
   "id": "type",
   "numeral": "IV",
   "title": "Type & drawing",
   "about": "Letters that move, and tools that draw.",
   "specimens": [
    "proximity",
    "decoder",
    "marquee",
    "nib",
    "letters",
    "flap",
    "typewriter",
    "kaleido",
    "textpath",
    "scatter",
    "ascii",
    "bristle",
    "spray",
    "elastic",
    "cylinder",
    "signature",
    "spiro",
    "dotmatrix"
   ]
  },
  {
   "id": "interface",
   "numeral": "V",
   "title": "Interface",
   "about": "Small interactions that make controls feel physical.",
   "specimens": [
    "magnetic",
    "scrolling",
    "morph",
    "odometer",
    "rubber",
    "toggles",
    "picker",
    "swipe",
    "sortable",
    "sheet",
    "hold",
    "tabs",
    "toasts",
    "pill",
    "like",
    "eslider",
    "shuffle"
   ]
  }
 ],
 "specimens": [
  {
   "id": "parallax",
   "number": 1,
   "name": "Ridgeline parallax",
   "technique": "Clip-path layers",
   "inputs": {
    "pointer": "move · scroll the page",
    "touch": "drag · scroll the page"
   },
   "description": "Seven mountain ridges stacked by depth. Near ridges travel farther than distant ones, so the scene reads as three-dimensional with no 3D engine at all.",
   "try": "Move your pointer across the scene, then scroll the page and watch the near ridges rise faster than the far ones.",
   "details": {
    "Technique": "clip-path polygons, translate3d",
    "Inputs": "Pointer position, scroll offset",
    "Layers": "7, depth 0.15 → 1.00",
    "Easing": "Lerp, 6% per frame"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/parallax",
   "page_url": "https://specimens.llmvuln.xyz/#parallax",
   "bytes": 4974
  },
  {
   "id": "foil",
   "number": 2,
   "name": "Holographic foil card",
   "technique": "Blend modes",
   "inputs": {
    "pointer": "hover to tilt · click to flip",
    "touch": "drag to tilt · tap to flip"
   },
   "description": "A trading card that tilts toward your pointer on a damped spring. A rainbow foil and a glare highlight slide across it through blend modes, so the shine follows the light.",
   "try": "Hover over the stage to tilt the card. Click it, or press Enter when it has focus, to flip it.",
   "details": {
    "Technique": "preserve-3d, color-dodge, overlay",
    "Inputs": "Pointer position, click",
    "Spring": "Stiffness 170, damping 18",
    "Tilt range": "±18° on both axes"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/foil",
   "page_url": "https://specimens.llmvuln.xyz/#foil",
   "bytes": 8014
  },
  {
   "id": "carousel",
   "number": 3,
   "name": "Carousel ring",
   "technique": "Preserve-3d ring",
   "inputs": {
    "pointer": "drag to spin",
    "touch": "drag to spin"
   },
   "description": "Twelve month calendars for 2026 stand on a ring in 3D space, with today marked in blue. Drag to spin it; it coasts with friction and snaps to the nearest panel. Left alone for a few seconds, it turns slowly on its own.",
   "try": "Drag sideways to spin the ring, or use the arrow buttons.",
   "details": {
    "Technique": "rotateY + translateZ, inertia",
    "Panels": "12 months of 2026, 30° apart",
    "Friction": "Speed halves every 0.28 s"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/carousel",
   "page_url": "https://specimens.llmvuln.xyz/#carousel",
   "bytes": 7400
  },
  {
   "id": "sphere",
   "number": 4,
   "name": "Point sphere",
   "technique": "Projection",
   "inputs": {
    "pointer": "drag to throw · hover to bulge",
    "touch": "drag to throw"
   },
   "description": "Nine hundred points spread evenly over a sphere with the golden-angle spiral, rotated and projected with plain trigonometry. Nearer points grow larger and brighter, and your pointer raises a bulge on the side facing you.",
   "try": "Drag to spin the sphere and let go to throw it. Hover over its face to push the points out.",
   "details": {
    "Technique": "Fibonacci sphere, perspective projection on canvas",
    "Points": "900, drawn back to front",
    "Throw": "Drag velocity with exponential friction"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/sphere",
   "page_url": "https://specimens.llmvuln.xyz/#sphere",
   "bytes": 5680
  },
  {
   "id": "extrude",
   "number": 5,
   "name": "Extruded type",
   "technique": "Stacked slices",
   "inputs": {
    "pointer": "move to turn · click for a new word",
    "touch": "drag to turn · tap for a new word"
   },
   "description": "A word built from 28 copies of itself, each pushed 1.6 px further back in 3D space and shaded darker. Together they read as a solid block of type that turns toward your pointer.",
   "try": "Move your pointer around the stage to turn the block. Click to change the word.",
   "details": {
    "Technique": "preserve-3d, stacked translateZ slices",
    "Depth": "28 slices × 1.6 px",
    "Tilt": "±28° on a spring"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/extrude",
   "page_url": "https://specimens.llmvuln.xyz/#extrude",
   "bytes": 3877
  },
  {
   "id": "explode",
   "number": 6,
   "name": "Layer explode",
   "technique": "Exploded view",
   "inputs": {
    "pointer": "click to explode",
    "touch": "tap to explode"
   },
   "description": "A notification card pulled apart into the five layers it is built from, like an exploded technical drawing. One spring drives the separation, the isometric turn and the labels.",
   "try": "Click to explode or collapse the card. Move your pointer to swing it a little.",
   "details": {
    "Technique": "preserve-3d, translateZ per layer",
    "Layers": "Shadow, surface, texture, content, focus ring",
    "Spring": "Stiffness 140, damping 17"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/explode",
   "page_url": "https://specimens.llmvuln.xyz/#explode",
   "bytes": 6798
  },
  {
   "id": "halftone",
   "number": 7,
   "name": "Halftone light",
   "technique": "Lambert shading",
   "inputs": {
    "pointer": "move the lamp",
    "touch": "drag to swing the light"
   },
   "description": "A raised word printed in halftone dots. Each dot's size is a base that shows the letters, plus how much light its patch of slope catches, so the sides facing the lamp lighten and the far sides fall into shadow.",
   "try": "Move your pointer to carry the lamp. At the centre it shines from overhead; toward the edges it rakes in low and the relief deepens.",
   "details": {
    "Technique": "Height map → normals → Lambert shading",
    "Grid": "5 px dots",
    "Light": "Follows the pointer, 72° overhead at the centre to 38° at the edges"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/halftone",
   "page_url": "https://specimens.llmvuln.xyz/#halftone",
   "bytes": 7390
  },
  {
   "id": "fold",
   "number": 8,
   "name": "Paper fold",
   "technique": "Hinged panels",
   "inputs": {
    "pointer": "click to fold",
    "touch": "tap to fold"
   },
   "description": "A letter folded in thirds. Unfolding, the top flap leads and the bottom follows; folding, the order reverses. Each flap darkens as it turns away from the light.",
   "try": "Click to fold or unfold the letter.",
   "details": {
    "Technique": "preserve-3d hinged panels",
    "Panels": "Three thirds, front and back faces",
    "Spring": "Stiffness 120, damping 15"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/fold",
   "page_url": "https://specimens.llmvuln.xyz/#fold",
   "bytes": 5654
  },
  {
   "id": "focus",
   "number": 9,
   "name": "Focus pull",
   "technique": "Depth of field",
   "inputs": {
    "pointer": "move up and down to focus",
    "touch": "drag up and down to focus"
   },
   "description": "Eleven cards stand at different depths, and each one blurs by how far it sits from the focal plane, like a wide-open lens. A spring racks focus from card to card with a slight lag, the way a focus puller turns the wheel.",
   "try": "Move up and down the stage to turn the focus: top is far, bottom is near. Click or tab to a card to snap to it.",
   "details": {
    "Technique": "CSS 3D depth, blur by distance from the focal plane",
    "Blur": "1 px per 34 px of depth, up to 9 px",
    "Focus": "Spring k 60, c 13"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/focus",
   "page_url": "https://specimens.llmvuln.xyz/#focus",
   "bytes": 7038
  },
  {
   "id": "die",
   "number": 10,
   "name": "Rolling die",
   "technique": "Edge pivot",
   "inputs": {
    "pointer": "click or arrow keys to roll",
    "touch": "swipe to roll"
   },
   "description": "A die tips over its bottom edge one square at a time, a quarter turn about that edge. Its orientation is kept as a rotation matrix, so the pips facing up always agree with the way it rolled.",
   "try": "Use the arrow keys, click beside the die, or swipe to roll it. Rolling into an edge only rocks it.",
   "details": {
    "Technique": "Rodrigues rotation about the leading edge",
    "Board": "7 × 5 squares, visited squares glow",
    "Roll": "260 ms, eased in and out"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/die",
   "page_url": "https://specimens.llmvuln.xyz/#die",
   "bytes": 13870
  },
  {
   "id": "shadows",
   "number": 11,
   "name": "Shadow casting",
   "technique": "Visibility polygon",
   "inputs": {
    "pointer": "move the lamp · drag blocks",
    "touch": "drag to move the lamp"
   },
   "description": "A lamp over a floor of blocks. Rays go out to every block corner and stop at the first wall they hit; joined in order, the hits outline everything the lamp can see. Three lamp positions a few pixels apart soften the shadow edges.",
   "try": "Move the lamp with your pointer. Drag a block to move it.",
   "details": {
    "Technique": "Visibility polygon by ray casting",
    "Rays": "3 per corner, nudged either side",
    "Penumbra": "3 lamp samples"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/shadows",
   "page_url": "https://specimens.llmvuln.xyz/#shadows",
   "bytes": 8944
  },
  {
   "id": "lens",
   "number": 12,
   "name": "Glass lens",
   "technique": "Barrel distortion",
   "inputs": {
    "pointer": "move the lens · click for power",
    "touch": "drag the lens · tap for power"
   },
   "description": "A magnifier over a page of type and graph paper. Each pixel inside the lens reads from a point nearer its centre, so the middle is enlarged and the rim bends straight lines. Red and blue bend by slightly different amounts, which fringes the edge like real glass.",
   "try": "Move the lens with your pointer. Click to switch between ×1.5, ×2 and ×3.",
   "details": {
    "Technique": "Per-pixel radial remap, ImageData",
    "Mapping": "r_src = r · (1 − k + k·r²)",
    "Fringe": "Red 6% stronger, blue 6% weaker"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/lens",
   "page_url": "https://specimens.llmvuln.xyz/#lens",
   "bytes": 8835
  },
  {
   "id": "iso",
   "number": 13,
   "name": "Isometric field",
   "technique": "Isometric projection",
   "inputs": {
    "pointer": "move over it · click to ripple",
    "touch": "drag over it · tap to ripple"
   },
   "description": "A grid of columns in isometric projection, drawn from the back corner forward so nearer columns cover farther ones. Each height is a spring chasing a slow swell and a bump under the pointer; a click sends a ring across the field.",
   "try": "Move over the field to raise it. Click to start a ripple.",
   "details": {
    "Technique": "Isometric projection, painter's order",
    "Grid": "14 × 14 columns",
    "Springs": "k 140, c 14 per column"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/iso",
   "page_url": "https://specimens.llmvuln.xyz/#iso",
   "bytes": 6040
  },
  {
   "id": "lenticular",
   "number": 14,
   "name": "Lenticular card",
   "technique": "Interleaved strips",
   "inputs": {
    "pointer": "move to tilt · click to swap",
    "touch": "drag to tilt · tap to swap"
   },
   "description": "A ridged card hiding several pictures in thin interleaved strips. Which strip each ridge shows depends on the viewing angle, and that angle changes slightly across the card, so a tilt sweeps the change from one edge to the other.",
   "try": "Move sideways to tilt the card. Click to swap between the wink and the moon phases.",
   "details": {
    "Technique": "Interleaved strips chosen by angle",
    "Strips": "5 px per ridge",
    "Cards": "Wink, 3 frames · phases, 4 frames"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/lenticular",
   "page_url": "https://specimens.llmvuln.xyz/#lenticular",
   "bytes": 8562
  },
  {
   "id": "solids",
   "number": 15,
   "name": "Platonic solids",
   "technique": "Back-face culling",
   "inputs": {
    "pointer": "drag to spin · click for the next",
    "touch": "drag to spin · tap for the next"
   },
   "description": "The five regular solids, written down only as lists of corners. Faces are found by brute force: a plane through three corners is a face when every other corner lies behind it. Faces turned away are culled and their edges dashed, like hidden lines on a technical drawing.",
   "try": "Drag to spin and throw. Click to step to the next solid.",
   "details": {
    "Technique": "Brute-force convex hull, back-face culling",
    "Solids": "Tetrahedron through icosahedron",
    "Shading": "Flat, by angle to the light"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/solids",
   "page_url": "https://specimens.llmvuln.xyz/#solids",
   "bytes": 10376
  },
  {
   "id": "shafts",
   "number": 16,
   "name": "Light shafts",
   "technique": "Radial blur",
   "inputs": {
    "pointer": "move the light · click for blinds",
    "touch": "drag the light · tap for blinds"
   },
   "description": "Light streaming past a word. A small buffer holds the light with the word blacked out over it, then it is smeared outward from the light by drawing it onto itself at growing scales. The gaps between letters stretch into beams.",
   "try": "Move the light with your pointer. Click to swap the word for window blinds.",
   "details": {
    "Technique": "Screen-space radial blur",
    "Passes": "5, scaled 1.06 to 2",
    "Buffer": "40% resolution"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/shafts",
   "page_url": "https://specimens.llmvuln.xyz/#shafts",
   "bytes": 6794
  },
  {
   "id": "curl",
   "number": 17,
   "name": "Page curl",
   "technique": "Fold reflection",
   "inputs": {
    "pointer": "drag the corner",
    "touch": "drag the corner"
   },
   "description": "Peeling a page is a reflection. The fold is the line halfway between the corner and your finger; everything past it is mirrored across that line and shows the paper's back, while the page below shows through. Let go past the middle and the page turns.",
   "try": "Drag the bottom-right corner. The turn page button flips it without dragging.",
   "details": {
    "Technique": "Reflection across the perpendicular bisector",
    "Clipping": "Sutherland–Hodgman against the fold",
    "Pages": "4, looping"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/curl",
   "page_url": "https://specimens.llmvuln.xyz/#curl",
   "bytes": 10736
  },
  {
   "id": "room",
   "number": 18,
   "name": "Perspective room",
   "technique": "Vanishing point",
   "inputs": {
    "pointer": "move to look around",
    "touch": "drag to look around"
   },
   "description": "A small gallery seen from inside, drawn with nothing but division by depth. Moving your eye sideways shifts near things more than far ones, and that difference is all the depth the picture needs.",
   "try": "Move your pointer to look around the room.",
   "details": {
    "Technique": "One-point perspective",
    "Projection": "screen = centre + (p − eye)·f / z",
    "Eye": "Leans up to 42% of the room width"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/room",
   "page_url": "https://specimens.llmvuln.xyz/#room",
   "bytes": 7976
  },
  {
   "id": "terrain",
   "number": 19,
   "name": "Wire terrain",
   "technique": "Perspective divide",
   "inputs": {
    "pointer": "steer · raise to fly faster",
    "touch": "steer · raise to fly faster"
   },
   "description": "An endless wireframe landscape flying toward you. Hills come from three crossed sine waves, each grid point is projected by dividing by its distance, and far rows fade into blue haze.",
   "try": "Move your pointer left and right to steer. Raise it to fly faster, lower it to slow down.",
   "details": {
    "Technique": "Perspective divide on canvas, no 3D library",
    "Grid": "44 × 40 points",
    "Terrain": "Three crossed sine waves with a valley"
   },
   "family": "depth",
   "source_url": "https://specimens.llmvuln.xyz/s/terrain",
   "page_url": "https://specimens.llmvuln.xyz/#terrain",
   "bytes": 5000
  },
  {
   "id": "field",
   "number": 20,
   "name": "Spring dot field",
   "technique": "Canvas springs",
   "inputs": {
    "pointer": "sweep · click for a shockwave",
    "touch": "sweep · tap for a shockwave"
   },
   "description": "A grid of dots, each tied to its home position by its own spring. Your pointer pushes them aside, and a click sends a shockwave rippling outward.",
   "try": "Sweep your pointer through the grid and click anywhere. Lower the damping to make the dots wobble longer.",
   "details": {
    "Technique": "Canvas 2D, per-dot spring",
    "Inputs": "Pointer repels, click ripples",
    "Push radius": "110 px"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/field",
   "page_url": "https://specimens.llmvuln.xyz/#field",
   "bytes": 4811
  },
  {
   "id": "goo",
   "number": 21,
   "name": "Gooey blobs",
   "technique": "SVG filter",
   "inputs": {
    "pointer": "merge · click to fling",
    "touch": "drag to merge · tap to fling"
   },
   "description": "Blurring a group of circles and then sharpening the blur's edge back to a hard line makes nearby shapes melt into each other, like drops of liquid.",
   "try": "Move your pointer into the orbiting blobs to merge with them. Click to fling off droplets that get pulled back in.",
   "details": {
    "Technique": "feGaussianBlur + feColorMatrix",
    "Inputs": "Pointer on a spring, click spawns drops",
    "Alpha curve": "a × 22 − 9"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/goo",
   "page_url": "https://specimens.llmvuln.xyz/#goo",
   "bytes": 4930
  },
  {
   "id": "boids",
   "number": 22,
   "name": "Flocking boids",
   "technique": "Steering rules",
   "inputs": {
    "pointer": "chase · click to scatter",
    "touch": "chase · tap to scatter"
   },
   "description": "Each bird follows three local rules: keep some distance, match its neighbours' heading, and drift toward the group. Flocks emerge from that alone. Your pointer is a predator.",
   "try": "Chase the flock with your pointer, or click to scatter it.",
   "details": {
    "Technique": "Boids, after Craig Reynolds (1987)",
    "Birds": "30 to 140, scaled to the stage",
    "Sight": "50 px, personal space 20 px"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/boids",
   "page_url": "https://specimens.llmvuln.xyz/#boids",
   "bytes": 5152
  },
  {
   "id": "cloth",
   "number": 23,
   "name": "Verlet cloth",
   "technique": "Verlet integration",
   "inputs": {
    "pointer": "grab · yank to tear",
    "touch": "grab · yank to tear"
   },
   "description": "A sheet of 600 points held together by springy links, hanging from pins. Points remember where they were a frame ago, and that difference is their speed. Pull too hard and links snap.",
   "try": "Grab the cloth and drag it around. Yank fast to tear it, then press new cloth.",
   "details": {
    "Technique": "Verlet integration with distance constraints",
    "Grid": "30 × 20 points, 4 solver passes",
    "Tearing": "Links snap past 2.6× their length"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/cloth",
   "page_url": "https://specimens.llmvuln.xyz/#cloth",
   "bytes": 6060
  },
  {
   "id": "slosh",
   "number": 24,
   "name": "Slosh meter",
   "technique": "Spring chain",
   "inputs": {
    "pointer": "drag the level · shake",
    "touch": "drag the level · shake"
   },
   "description": "A progress gauge with a liquid inside. The surface is a row of springs that pass energy to their neighbours, so changing the level or shaking the glass sends waves across.",
   "try": "Drag up and down to set the level. Move sideways quickly to shake it.",
   "details": {
    "Technique": "1D spring chain with neighbour spreading",
    "Surface": "48 springs",
    "Level": "Spring k 26, c 7"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/slosh",
   "page_url": "https://specimens.llmvuln.xyz/#slosh",
   "bytes": 6872
  },
  {
   "id": "harp",
   "number": 25,
   "name": "String harp",
   "technique": "Web audio",
   "inputs": {
    "pointer": "strum · turn sound on",
    "touch": "swipe across · turn sound on"
   },
   "description": "Eight strings tuned to a pentatonic scale, so any strum sounds right. Each string bows out and rings down when you cross it. Sound is off until you turn it on.",
   "try": "Sweep your pointer across the strings. Press sound off to hear them.",
   "details": {
    "Technique": "Crossing detection, Web Audio",
    "Scale": "C pentatonic, C4 to E5",
    "Voice": "Triangle wave through a falling low-pass"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/harp",
   "page_url": "https://specimens.llmvuln.xyz/#harp",
   "bytes": 6813
  },
  {
   "id": "orbits",
   "number": 26,
   "name": "Orbit sandbox",
   "technique": "Inverse square",
   "inputs": {
    "pointer": "pull back · release",
    "touch": "pull back · release"
   },
   "description": "A star and its planets under real inverse-square gravity. Drag to launch a new planet like a slingshot, and a dotted line shows where it will go before you let go.",
   "try": "Press, pull back and release to launch a planet. Watch the preview to aim for an orbit.",
   "details": {
    "Technique": "Velocity Verlet, 4 substeps",
    "Gravity": "a = G·m / r²",
    "Preview": "3 s simulated ahead"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/orbits",
   "page_url": "https://specimens.llmvuln.xyz/#orbits",
   "bytes": 7075
  },
  {
   "id": "jelly",
   "number": 27,
   "name": "Soft-body jelly",
   "technique": "Pressure body",
   "inputs": {
    "pointer": "grab and throw",
    "touch": "grab and throw"
   },
   "description": "A blob made of a springy skin with air pressure inside. The skin keeps its edge lengths, the pressure keeps its area, and between the two it squashes, wobbles and recovers.",
   "try": "Grab the jelly and throw it at the walls.",
   "details": {
    "Technique": "Spring skin plus area pressure",
    "Skin": "28 points, 8 substeps",
    "Pressure": "Pushes edges out by the area deficit"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/jelly",
   "page_url": "https://specimens.llmvuln.xyz/#jelly",
   "bytes": 6401
  },
  {
   "id": "cradle",
   "number": 28,
   "name": "Newton's cradle",
   "technique": "Momentum exchange",
   "inputs": {
    "pointer": "pull a ball and let go",
    "touch": "pull a ball and let go"
   },
   "description": "Five pendulums whose balls just touch. When two meet and are closing, they swap speeds, which is what an elastic collision between equal masses does. Repeating that pass along the row many times a frame carries a hit straight through to the far end.",
   "try": "Pull one or two balls aside and let go.",
   "details": {
    "Technique": "Pendulums plus sequential speed exchange",
    "Substeps": "16 per frame",
    "Restitution": "0.995"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/cradle",
   "page_url": "https://specimens.llmvuln.xyz/#cradle",
   "bytes": 8594
  },
  {
   "id": "ballpit",
   "number": 29,
   "name": "Ball pit",
   "technique": "Circle collisions",
   "inputs": {
    "pointer": "push through · click to kick",
    "touch": "drag through · tap to kick"
   },
   "description": "Hundreds of Verlet balls in a box. Every step they fall, then a few passes push apart any pair that overlaps, keep them inside, and shove them out of the pointer's disc. A grid of buckets means each ball only checks its neighbours.",
   "try": "Push through the pile. Click to kick the balls near the pointer upward.",
   "details": {
    "Technique": "Verlet integration, overlap relaxation",
    "Passes": "4 per frame",
    "Neighbours": "Spatial hash grid"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/ballpit",
   "page_url": "https://specimens.llmvuln.xyz/#ballpit",
   "bytes": 6535
  },
  {
   "id": "filings",
   "number": 30,
   "name": "Iron filings",
   "technique": "Dipole field",
   "inputs": {
    "pointer": "drag a magnet · click to flip",
    "touch": "drag a magnet · tap to flip"
   },
   "description": "Two bar magnets and a scatter of filings. Each magnet is a pair of poles, and the field anywhere is the sum of their pulls. Every filing turns toward it on a spring, longer and darker where the field is strong.",
   "try": "Drag a magnet to move it. Click one to flip it end for end.",
   "details": {
    "Technique": "Pole pairs, field summed per filing",
    "Filings": "One per 11 px, jittered",
    "Turning": "Spring toward the field, either end first"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/filings",
   "page_url": "https://specimens.llmvuln.xyz/#filings",
   "bytes": 7465
  },
  {
   "id": "double",
   "number": 31,
   "name": "Double pendulum",
   "technique": "Sensitive dependence",
   "inputs": {
    "pointer": "drag a bob · click to restart",
    "touch": "drag a bob · tap to restart"
   },
   "description": "Two double pendulums, identical except that one starts a thousandth of a radian further round. For a few seconds they move as one; then the gap doubles and doubles again until their paths have nothing in common.",
   "try": "Drag either bob to pose them, then let go. Click empty space to restart from the current pose.",
   "details": {
    "Technique": "Lagrangian equations, Runge–Kutta 4",
    "Offset": "0.001 rad on the second arm",
    "Steps": "8 per frame"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/double",
   "page_url": "https://specimens.llmvuln.xyz/#double",
   "bytes": 7427
  },
  {
   "id": "fluid",
   "number": 32,
   "name": "Particle fluid",
   "technique": "Density relaxation",
   "inputs": {
    "pointer": "stir it",
    "touch": "drag to stir"
   },
   "description": "Water made of particles. Each one measures how crowded it is twice: a plain density that pushes toward a resting value, and a near density that only ever pushes apart. Neighbours are nudged by both, and velocity is simply how far a particle moved.",
   "try": "Stir the water with your pointer. Left alone, the box tilts and the water sloshes.",
   "details": {
    "Technique": "Double density relaxation (Clavet et al., 2005)",
    "Particles": "Up to 1,400, reach 22 px",
    "Foam": "Fast or thinly surrounded particles whiten"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/fluid",
   "page_url": "https://specimens.llmvuln.xyz/#fluid",
   "bytes": 8301
  },
  {
   "id": "grass",
   "number": 33,
   "name": "Grass field",
   "technique": "Damped springs",
   "inputs": {
    "pointer": "sweep through it",
    "touch": "swipe through it"
   },
   "description": "Hundreds of blades, each a damped spring rooted in the ground. Wind is a slow travelling wave plus gusts, so neighbours lean together, and the pointer pushes blades away harder the faster it moves. Back rows are shorter and paler.",
   "try": "Sweep your pointer through the grass.",
   "details": {
    "Technique": "Angular spring per blade",
    "Rows": "6, paler and shorter toward the back",
    "Wind": "Travelling sine plus two slow gusts"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/grass",
   "page_url": "https://specimens.llmvuln.xyz/#grass",
   "bytes": 5427
  },
  {
   "id": "buoyancy",
   "number": 34,
   "name": "Buoyancy",
   "technique": "Archimedes",
   "inputs": {
    "pointer": "drag a block and drop it",
    "touch": "drag a block and drop it"
   },
   "description": "Blocks of different densities in water. Each outline is cut by the waterline; the part below is the displaced water, and it pushes up through its own centre. A block floats with the same fraction under as its density, turning until the two forces line up.",
   "try": "Drag a block anywhere and let go. Try pushing one under.",
   "details": {
    "Technique": "Submerged polygon area and centroid",
    "Densities": "0.25, 0.55, 0.85",
    "Surface": "64 springs, stirred by the blocks"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/buoyancy",
   "page_url": "https://specimens.llmvuln.xyz/#buoyancy",
   "bytes": 10138
  },
  {
   "id": "gears",
   "number": 35,
   "name": "Gear train",
   "technique": "Gear ratios",
   "inputs": {
    "pointer": "grab a gear and turn",
    "touch": "drag a gear to turn it"
   },
   "description": "Five meshing gears. Gears in contact move the same distance at their rims, so each turns at minus the ratio of their tooth counts. Every angle comes from the first gear's angle plus an offset that keeps teeth in gaps.",
   "try": "Grab any gear and turn it; the whole train follows and coasts.",
   "details": {
    "Technique": "Angle chained through tooth ratios",
    "Teeth": "24, 12, 30, 9, 18",
    "Motor": "0.5 rad/s when idle"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/gears",
   "page_url": "https://specimens.llmvuln.xyz/#gears",
   "bytes": 7235
  },
  {
   "id": "magnets",
   "number": 36,
   "name": "Magnet pendulum",
   "technique": "Basins of attraction",
   "inputs": {
    "pointer": "click to drop the bob",
    "touch": "tap to drop the bob"
   },
   "description": "A pendulum over three magnets. Which one it settles on is chaotic: start points a hair apart can finish on different magnets. Behind the live bob, a map of every start point and its magnet fills in, and its borders are fractal.",
   "try": "Click anywhere to drop the bob there.",
   "details": {
    "Technique": "Spring, softened attraction, friction",
    "Map": "3 px cells, a few rows each frame",
    "Magnets": "3, 120° apart"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/magnets",
   "page_url": "https://specimens.llmvuln.xyz/#magnets",
   "bytes": 7697
  },
  {
   "id": "fireworks",
   "number": 37,
   "name": "Fireworks",
   "technique": "Ballistics",
   "inputs": {
    "pointer": "click to launch",
    "touch": "tap to launch"
   },
   "description": "Shells are aimed to peak where you click: the launch speed that reaches a height is the square root of twice gravity times that height. At the top they burst into sparks that keep the shell's motion, then fall under gravity and drag.",
   "try": "Click where a shell should burst.",
   "details": {
    "Technique": "Ballistic particles with drag",
    "Bursts": "Peony, ring, willow, crossette",
    "Trails": "Last frame faded, never cleared"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/fireworks",
   "page_url": "https://specimens.llmvuln.xyz/#fireworks",
   "bytes": 6169
  },
  {
   "id": "pendulum",
   "number": 38,
   "name": "Pendulum wave",
   "technique": "Phase drift",
   "inputs": {
    "pointer": "click to restart in phase",
    "touch": "tap to restart in phase"
   },
   "description": "Fifteen pendulums, each tuned to swing once more per cycle than its neighbour. They drift in and out of step, tracing travelling snakes, splits and braids, and line up again every 30 seconds.",
   "try": "Watch the patterns form. Click to restart every pendulum in phase.",
   "details": {
    "Technique": "Closed-form cosine per pendulum on canvas",
    "Tuning": "18 to 32 swings per 30 s cycle",
    "View": "From above the rail, so depth reads as drop"
   },
   "family": "physics",
   "source_url": "https://specimens.llmvuln.xyz/s/pendulum",
   "page_url": "https://specimens.llmvuln.xyz/#pendulum",
   "bytes": 4326
  },
  {
   "id": "ribbons",
   "number": 39,
   "name": "Pointer ribbons",
   "technique": "Eased chains",
   "inputs": {
    "pointer": "move in loops",
    "touch": "drag in loops"
   },
   "description": "Three ribbons chase your pointer. Each is a chain of points where every point eases toward the one ahead of it, so the tail swings behind like a silk streamer.",
   "try": "Move your pointer in loops and quick flicks.",
   "details": {
    "Technique": "Canvas 2D, eased point chains",
    "Points": "3 ribbons × 40",
    "Smoothing": "Quadratic curves through midpoints"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/ribbons",
   "page_url": "https://specimens.llmvuln.xyz/#ribbons",
   "bytes": 4349
  },
  {
   "id": "sand",
   "number": 40,
   "name": "Falling sand",
   "technique": "Cellular automaton",
   "inputs": {
    "pointer": "press to pour",
    "touch": "press to pour"
   },
   "description": "A cellular automaton. Each grain checks the cell below it, then the two diagonals, and moves into the first empty one. Piles, slopes and avalanches come out of that one rule.",
   "try": "Press and drag to pour sand. Clear the box to start over.",
   "details": {
    "Technique": "Cellular automaton on a pixel grid",
    "Rule": "Down, else down-left or down-right",
    "Grain": "4 px, 1 in 20 is blue"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/sand",
   "page_url": "https://specimens.llmvuln.xyz/#sand",
   "bytes": 5509
  },
  {
   "id": "epicycles",
   "number": 41,
   "name": "Fourier epicycles",
   "technique": "Fourier series",
   "inputs": {
    "pointer": "draw a closed shape",
    "touch": "draw a closed shape"
   },
   "description": "Any closed drawing can be rebuilt from circles spinning at whole-number speeds. Draw a shape and a discrete Fourier transform turns it into a chain of circles that trace it back.",
   "try": "Draw a closed shape on the stage. Lower the circles slider to see how few it takes to get close.",
   "details": {
    "Technique": "Discrete Fourier transform of the path",
    "Samples": "160 points, evenly spaced along the stroke",
    "Order": "Largest circles first"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/epicycles",
   "page_url": "https://specimens.llmvuln.xyz/#epicycles",
   "bytes": 8029
  },
  {
   "id": "contours",
   "number": 42,
   "name": "Topographic metaballs",
   "technique": "Marching squares",
   "inputs": {
    "pointer": "move to add a blob",
    "touch": "drag to add a blob"
   },
   "description": "Six drifting blobs and your pointer add up to one height field, drawn as contour lines like a hiking map. Marching squares finds where each height crosses the grid.",
   "try": "Move your pointer into the stage; it becomes another blob the lines bend around.",
   "details": {
    "Technique": "Metaball field, marching squares",
    "Levels": "6 contours, one highlighted in blue",
    "Grid": "7 px cells"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/contours",
   "page_url": "https://specimens.llmvuln.xyz/#contours",
   "bytes": 5133
  },
  {
   "id": "voronoi",
   "number": 43,
   "name": "Voronoi cells",
   "technique": "Nearest seed",
   "inputs": {
    "pointer": "move · click to plant",
    "touch": "drag · tap to plant"
   },
   "description": "Every point on the stage belongs to its nearest seed. The borders are where two seeds tie, so the cells reshape themselves as the seeds drift.",
   "try": "Move your pointer to carry a seed of your own. Click to plant one where you are.",
   "details": {
    "Technique": "Nearest and second-nearest seed per pixel",
    "Seeds": "22 drifting, up to 48 with clicks",
    "Edges": "Where the two distances nearly tie"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/voronoi",
   "page_url": "https://specimens.llmvuln.xyz/#voronoi",
   "bytes": 4879
  },
  {
   "id": "zoom",
   "number": 44,
   "name": "Infinite zoom",
   "technique": "Self-similar",
   "inputs": {
    "pointer": "scroll or drag to dive",
    "touch": "scroll or drag to dive"
   },
   "description": "An endless dive through nested frames, each a little smaller and a little turned. Only the fractional part of the depth decides the picture, so the zoom never has to stop.",
   "try": "Scroll or drag up and down to dive faster or climb back out.",
   "details": {
    "Technique": "Self-similar frames, fractional depth",
    "Step": "1.32× smaller, 0.21 rad turn",
    "Marks": "Every fifth frame in blue"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/zoom",
   "page_url": "https://specimens.llmvuln.xyz/#zoom",
   "bytes": 4940
  },
  {
   "id": "life",
   "number": 45,
   "name": "Game of Life",
   "technique": "B3/S23",
   "inputs": {
    "pointer": "draw to add cells",
    "touch": "draw to add cells"
   },
   "description": "Conway's rules on a grid that wraps at the edges. A dead cell with exactly three live neighbours is born, a live cell with two or three survives, and every other cell dies. Newborns show in blue.",
   "try": "Draw on the grid to add cells. Reseed for a fresh random board.",
   "details": {
    "Technique": "B3/S23 on a torus",
    "Cells": "8 px",
    "Tick": "90 ms a generation"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/life",
   "page_url": "https://specimens.llmvuln.xyz/#life",
   "bytes": 6225
  },
  {
   "id": "rd",
   "number": 46,
   "name": "Reaction-diffusion",
   "technique": "Gray–Scott",
   "inputs": {
    "pointer": "paint · pick a preset",
    "touch": "drag to paint"
   },
   "description": "Two simulated chemicals. One is fed in everywhere, the other eats it to make more of itself and slowly decays, and both spread, one twice as fast. Two numbers, the feed and kill rates, decide whether you get coral, dividing cells or a maze.",
   "try": "Paint on the stage to add the second chemical. Switch between the presets.",
   "details": {
    "Technique": "Gray–Scott model",
    "Grid": "One cell per 3 px, 10 steps a frame",
    "Presets": "Coral, cells, maze"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/rd",
   "page_url": "https://specimens.llmvuln.xyz/#rd",
   "bytes": 6946
  },
  {
   "id": "harmonograph",
   "number": 47,
   "name": "Harmonograph",
   "technique": "Damped sinusoids",
   "inputs": {
    "pointer": "click for the next ratio",
    "touch": "tap for the next ratio"
   },
   "description": "A pen moved by pendulums that each swing at their own frequency and slowly lose energy. Near-whole-number ratios close into figures, a slight detune lands each loop beside the last, and the decay draws them inward.",
   "try": "Watch it draw. Click to start the next ratio.",
   "details": {
    "Technique": "Sum of damped sines on each axis",
    "Ratios": "2:3, 3:4, 1:2 and four more",
    "Colour": "Blue to ink as the swing dies"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/harmonograph",
   "page_url": "https://specimens.llmvuln.xyz/#harmonograph",
   "bytes": 4907
  },
  {
   "id": "lorenz",
   "number": 48,
   "name": "Lorenz attractor",
   "technique": "Strange attractor",
   "inputs": {
    "pointer": "drag to turn",
    "touch": "drag to turn"
   },
   "description": "Three points following the Lorenz equations, started almost together. They loop round one wing, then the other, in an order no one can predict, and before long they part for good.",
   "try": "Drag to turn the figure.",
   "details": {
    "Technique": "Lorenz system, Runge–Kutta 4",
    "Parameters": "σ 10, ρ 28, β 8/3",
    "Trails": "900 points each"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/lorenz",
   "page_url": "https://specimens.llmvuln.xyz/#lorenz",
   "bytes": 5359
  },
  {
   "id": "tree",
   "number": 49,
   "name": "Fractal tree",
   "technique": "Recursive branching",
   "inputs": {
    "pointer": "click to grow · move for wind",
    "touch": "tap to grow · drag for wind"
   },
   "description": "One rule applied to itself: a branch ends by splitting into two shorter, thinner branches. Random angles and lengths make every tree different, and the wind bends twigs more than limbs.",
   "try": "Click to grow a new tree. Move sideways to push the wind.",
   "details": {
    "Technique": "Recursive branching",
    "Depth": "10 levels, growing in over 1.8 s",
    "Wind": "Stronger toward the twigs, toward the pointer"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/tree",
   "page_url": "https://specimens.llmvuln.xyz/#tree",
   "bytes": 5142
  },
  {
   "id": "flow",
   "number": 50,
   "name": "Flow field",
   "technique": "Noise field",
   "inputs": {
    "pointer": "move to stir",
    "touch": "drag to stir"
   },
   "description": "Smooth noise gives every point on the stage an angle. Particles walk that way and leave faint marks, so the field draws itself as streamlines. The noise drifts over time, and the pointer stirs a whirlpool.",
   "try": "Move your pointer to stir. Double-click for a new field.",
   "details": {
    "Technique": "3D value noise as an angle field",
    "Particles": "1,600, respawning",
    "Trails": "Faded 6% a frame"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/flow",
   "page_url": "https://specimens.llmvuln.xyz/#flow",
   "bytes": 5179
  },
  {
   "id": "julia",
   "number": 51,
   "name": "Julia set",
   "technique": "Escape time",
   "inputs": {
    "pointer": "move to change c",
    "touch": "drag to change c"
   },
   "description": "For every pixel, square it and add c, over and over, and count the steps before it escapes. Points that never escape form the Julia set for that c. Your pointer picks c, so the set morphs between dust, dendrites and spirals.",
   "try": "Move your pointer to change c.",
   "details": {
    "Technique": "Escape time, smoothed colouring",
    "Iterations": "Up to 90",
    "Resolution": "One sample per 2.2 px"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/julia",
   "page_url": "https://specimens.llmvuln.xyz/#julia",
   "bytes": 6018
  },
  {
   "id": "maze",
   "number": 52,
   "name": "Maze solver",
   "technique": "Depth-first carving",
   "inputs": {
    "pointer": "click for a new maze",
    "touch": "tap for a new maze"
   },
   "description": "A depth-first walk carves the maze, knocking down walls to random unvisited neighbours and backing up when stuck. Then a breadth-first flood spreads from the entrance; the first time it reaches the exit, its trail back is the shortest path.",
   "try": "Watch it carve and solve. Click to start a new maze.",
   "details": {
    "Technique": "Recursive backtracker, then breadth-first search",
    "Maze": "Perfect: one route between any two cells",
    "Cells": "12 to 22 px"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/maze",
   "page_url": "https://specimens.llmvuln.xyz/#maze",
   "bytes": 7119
  },
  {
   "id": "packing",
   "number": 53,
   "name": "Circle packing",
   "technique": "Grow to touch",
   "inputs": {
    "pointer": "click to plant",
    "touch": "tap to plant"
   },
   "description": "Seeds land at random free points and grow until they touch a neighbour or the edge. Later seeds have to fit the gaps, so the circles shrink as the space fills, the way bubbles and pebbles pack.",
   "try": "Click to plant a seed where you point.",
   "details": {
    "Technique": "Grow until touching",
    "Gap": "2 px between circles",
    "Restart": "Once nothing over 3.5 px fits"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/packing",
   "page_url": "https://specimens.llmvuln.xyz/#packing",
   "bytes": 5200
  },
  {
   "id": "galton",
   "number": 54,
   "name": "Galton board",
   "technique": "Binomial",
   "inputs": {
    "pointer": "click to drop 30",
    "touch": "tap to drop 30"
   },
   "description": "Every peg sends a ball left or right with even odds. The bin a ball lands in counts how many times it went right, so the bins fill like the binomial coefficients, which the blue curve shows as they build.",
   "try": "Watch the curve form. Click to drop thirty balls at once.",
   "details": {
    "Technique": "A coin flip per peg",
    "Rows": "11",
    "Curve": "n · C(11, k) / 2¹¹"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/galton",
   "page_url": "https://specimens.llmvuln.xyz/#galton",
   "bytes": 6584
  },
  {
   "id": "ripples",
   "number": 55,
   "name": "Water ripples",
   "technique": "Wave equation",
   "inputs": {
    "pointer": "drag · click to drop",
    "touch": "drag · tap to drop"
   },
   "description": "A small wave simulation runs on a grid behind the canvas. Every frame, each cell averages its neighbours, and the slope of the surface bends and lights the picture underneath.",
   "try": "Drag through the water, or click to drop a stone. Use the strength slider to calm or stir it.",
   "details": {
    "Technique": "2D wave equation, ImageData",
    "Grid": "One cell per 2 px, coarser on very large screens",
    "Damping": "2% of energy lost per frame"
   },
   "family": "math",
   "source_url": "https://specimens.llmvuln.xyz/s/ripples",
   "page_url": "https://specimens.llmvuln.xyz/#ripples",
   "bytes": 6667
  },
  {
   "id": "proximity",
   "number": 56,
   "name": "Proximity type",
   "technique": "Variable font",
   "inputs": {
    "pointer": "move closer",
    "touch": "drag across the words"
   },
   "description": "Each letter is set in a variable font, and its weight follows your pointer. Letters near it swell from hairline to black, while the rest stay thin.",
   "try": "Drag your pointer slowly across the words. Widen the radius to make more letters respond at once.",
   "details": {
    "Technique": "Variable font, weight axis 200 → 900",
    "Inputs": "Pointer distance to each letter",
    "Falloff": "Smoothstep, eased 18% per frame"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/proximity",
   "page_url": "https://specimens.llmvuln.xyz/#proximity",
   "bytes": 3479
  },
  {
   "id": "decoder",
   "number": 57,
   "name": "Text decoder",
   "technique": "Glyph scramble",
   "inputs": {
    "pointer": "click for the next word",
    "touch": "tap for the next word"
   },
   "description": "Words resolve out of random glyphs, letter by letter, like a terminal cracking a code. Each letter gets its own random start and finish frame, so the word settles unevenly.",
   "try": "Click the stage to jump to the next word.",
   "details": {
    "Technique": "requestAnimationFrame, per-letter timing",
    "Glyph set": "50 characters",
    "Resolve time": "10 to 34 frames per letter"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/decoder",
   "page_url": "https://specimens.llmvuln.xyz/#decoder",
   "bytes": 3685
  },
  {
   "id": "marquee",
   "number": 58,
   "name": "Velocity marquee",
   "technique": "Velocity skew",
   "inputs": {
    "pointer": "drag to throw",
    "touch": "drag to throw"
   },
   "description": "Two endless rows of type drift in opposite directions. Throw them with a drag and they speed up, lean into the motion, and ease back to cruising speed.",
   "try": "Drag sideways across the stage and let go.",
   "details": {
    "Technique": "translateX with seamless wrap, skewX from speed",
    "Cruise": "60 px/s",
    "Friction": "96% of the extra speed gone in 1 s"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/marquee",
   "page_url": "https://specimens.llmvuln.xyz/#marquee",
   "bytes": 3850
  },
  {
   "id": "nib",
   "number": 59,
   "name": "Broad-nib pen",
   "technique": "Nib sweep",
   "inputs": {
    "pointer": "draw · set the nib angle",
    "touch": "draw · set the nib angle"
   },
   "description": "A calligraphy pen with a flat nib held at a fixed angle. Strokes swell when they cross the nib and thin to a hairline when they run along it, just like ink on paper.",
   "try": "Draw on the stage. Change the nib angle and see how the same gesture changes weight.",
   "details": {
    "Technique": "Sweep the nib edge between smoothed points",
    "Nib": "16 px at 38°, adjustable",
    "Smoothing": "Pen trails the pointer by 65%"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/nib",
   "page_url": "https://specimens.llmvuln.xyz/#nib",
   "bytes": 6150
  },
  {
   "id": "letters",
   "number": 60,
   "name": "Hanging letters",
   "technique": "Pendulums",
   "inputs": {
    "pointer": "brush through · click to flick",
    "touch": "swipe through · tap to flick"
   },
   "description": "A word hung from a rail, one letter per thread. Each letter is a pendulum, so brushing past sets it swinging and longer threads swing slower.",
   "try": "Sweep your pointer through the letters. Click one to flick it.",
   "details": {
    "Technique": "Pendulum per letter, CSS rotate",
    "Threads": "Staggered lengths, 70 to 128 px",
    "Push": "Pointer speed through the glyph"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/letters",
   "page_url": "https://specimens.llmvuln.xyz/#letters",
   "bytes": 4709
  },
  {
   "id": "flap",
   "number": 61,
   "name": "Split-flap board",
   "technique": "Web animations",
   "inputs": {
    "pointer": "type a message",
    "touch": "type a message"
   },
   "description": "A departures board. Each cell steps through the alphabet one flap at a time: the old top half folds down over the seam, then the new bottom half drops into place.",
   "try": "Type a message and press show. Long ones break across both rows.",
   "details": {
    "Technique": "Four half-cards per cell, Web Animations",
    "Board": "2 rows × 10 cells",
    "Flap": "55 ms per half"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/flap",
   "page_url": "https://specimens.llmvuln.xyz/#flap",
   "bytes": 6983
  },
  {
   "id": "typewriter",
   "number": 62,
   "name": "Typewriter",
   "technique": "Ink jitter",
   "inputs": {
    "pointer": "click the paper, then type",
    "touch": "tap the paper, then type"
   },
   "description": "Type on a sheet of paper. Each key lands with its own ink weight, tilt and baseline like a real type bar, the bell rings near the margin, and the paper rolls up as it fills.",
   "try": "Click the paper and type. Backspace and Enter work too.",
   "details": {
    "Technique": "Per-glyph ink, rotation and baseline jitter",
    "Line": "28 characters, bell at 24",
    "Face": "Courier Prime"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/typewriter",
   "page_url": "https://specimens.llmvuln.xyz/#typewriter",
   "bytes": 5677
  },
  {
   "id": "kaleido",
   "number": 63,
   "name": "Kaleidoscope",
   "technique": "Mirror symmetry",
   "inputs": {
    "pointer": "draw · pick a symmetry",
    "touch": "draw · pick a symmetry"
   },
   "description": "Everything you draw is copied around the centre and mirrored in every other slice, so even a scribble comes out symmetrical. Strokes turn bluer the further they reach.",
   "try": "Draw on the stage. Switch between 6, 8 and 12 segments.",
   "details": {
    "Technique": "Rotate and mirror each segment N times",
    "Symmetry": "6, 8 or 12 slices",
    "Colour": "Ink to blue with distance from centre"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/kaleido",
   "page_url": "https://specimens.llmvuln.xyz/#kaleido",
   "bytes": 6131
  },
  {
   "id": "textpath",
   "number": 64,
   "name": "Text on a path",
   "technique": "Arc length",
   "inputs": {
    "pointer": "draw a line",
    "touch": "draw a line"
   },
   "description": "A sentence flowing along a line you draw. The line is measured by length, so each letter can sit at its own distance along it, turned to the line's direction there. Spacing stays even however the curve bends.",
   "try": "Draw a new line anywhere on the stage.",
   "details": {
    "Technique": "Arc-length lookup, rotated to the tangent",
    "Smoothing": "Two neighbour-averaging passes",
    "Scroll": "46 px a second"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/textpath",
   "page_url": "https://specimens.llmvuln.xyz/#textpath",
   "bytes": 5997
  },
  {
   "id": "scatter",
   "number": 65,
   "name": "Glyph scatter",
   "technique": "Glyph springs",
   "inputs": {
    "pointer": "move through · click to scatter",
    "touch": "drag through · tap to scatter"
   },
   "description": "Every letter is its own spring. The pointer pushes letters away within a radius, harder the faster it moves, and spins them a little, while each spring pulls its letter home.",
   "try": "Move through the word. Click to blow it apart.",
   "details": {
    "Technique": "A spring per glyph, translate and rotate",
    "Reach": "110 px",
    "Spring": "k 120, c 11"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/scatter",
   "page_url": "https://specimens.llmvuln.xyz/#scatter",
   "bytes": 4669
  },
  {
   "id": "ascii",
   "number": 66,
   "name": "ASCII render",
   "technique": "Luminance ramp",
   "inputs": {
    "pointer": "drag to turn · click for a shape",
    "touch": "drag to turn · tap for a shape"
   },
   "description": "A spinning 3D shape drawn entirely in characters. Points are sampled over the surface, rotated and projected into character cells; a depth buffer keeps the nearest, and its brightness picks a character from sparse to dense.",
   "try": "Drag to turn it. Click to switch between a torus, a sphere and a knot.",
   "details": {
    "Technique": "Depth-buffered points in a text grid",
    "Ramp": "12 characters from space to @",
    "Rate": "30 frames a second"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/ascii",
   "page_url": "https://specimens.llmvuln.xyz/#ascii",
   "bytes": 6756
  },
  {
   "id": "bristle",
   "number": 67,
   "name": "Bristle brush",
   "technique": "Bristle springs",
   "inputs": {
    "pointer": "paint",
    "touch": "paint"
   },
   "description": "A brush made of separate bristles, each at its own spot in the head and each trailing your hand on its own spring. Fast strokes splay them, and every bristle runs out of paint at its own rate, so strokes end in dry streaks.",
   "try": "Paint on the stage. Switch between ink and blue, or clear it.",
   "details": {
    "Technique": "Bristles on springs, paint load per bristle",
    "Bristles": "34",
    "Drying": "Load falls with distance painted"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/bristle",
   "page_url": "https://specimens.llmvuln.xyz/#bristle",
   "bytes": 7020
  },
  {
   "id": "spray",
   "number": 68,
   "name": "Spray paint",
   "technique": "Drip threshold",
   "inputs": {
    "pointer": "press to spray · hold still to drip",
    "touch": "press to spray · hold still to drip"
   },
   "description": "Each frame the can lays down a cloud of fine dots, densest in the middle. The wall keeps a tally of how much paint each patch has taken; past a limit a drip starts there and runs down, slowing as it thins.",
   "try": "Press and spray. Hold still in one spot to make it run.",
   "details": {
    "Technique": "Centre-weighted dot cloud, soak tally",
    "Drips": "Past 72 dots in a 6 px patch",
    "Run": "Slows by e^(−0.9t)"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/spray",
   "page_url": "https://specimens.llmvuln.xyz/#spray",
   "bytes": 6285
  },
  {
   "id": "elastic",
   "number": 69,
   "name": "Elastic headline",
   "technique": "Stretch springs",
   "inputs": {
    "pointer": "drag a letter up",
    "touch": "drag a letter up"
   },
   "description": "Letters stand on a baseline and stretch up from it. Drag one to set its height and its neighbours follow part of the way, so the word bends like rubber. Let go and each springs back through a squat.",
   "try": "Drag any letter up or down.",
   "details": {
    "Technique": "Scale from the baseline on springs",
    "Neighbours": "Follow by 0.45 per step away",
    "Volume": "Width shrinks as height grows"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/elastic",
   "page_url": "https://specimens.llmvuln.xyz/#elastic",
   "bytes": 4249
  },
  {
   "id": "cylinder",
   "number": 70,
   "name": "Text cylinder",
   "technique": "rotateY rings",
   "inputs": {
    "pointer": "drag to spin and tilt",
    "touch": "drag to spin and tilt"
   },
   "description": "Lines of text wrapped round a turning cylinder in CSS 3D, every letter turned to its angle and pushed out by the radius. Alternate rings turn opposite ways, and letters fade as they face away.",
   "try": "Drag sideways to spin the rings, up and down to tilt them.",
   "details": {
    "Technique": "rotateY then translateZ per letter",
    "Rings": "5, alternating direction",
    "Fade": "By the cosine of each letter's angle"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/cylinder",
   "page_url": "https://specimens.llmvuln.xyz/#cylinder",
   "bytes": 4593
  },
  {
   "id": "signature",
   "number": 71,
   "name": "Signature replay",
   "technique": "Recorded timing",
   "inputs": {
    "pointer": "sign above the line",
    "touch": "sign above the line"
   },
   "description": "Sign the pad and it plays your signature back exactly as you wrote it. Every pointer sample keeps its timestamp, and the replay reveals each stroke with a dash offset that follows the recorded clock, pauses and flourishes included.",
   "try": "Sign above the line. Pause and it replays; press replay to watch again.",
   "details": {
    "Technique": "stroke-dashoffset driven by recorded time",
    "Strokes": "Any number, grouped until a pause",
    "Speed": "Real time"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/signature",
   "page_url": "https://specimens.llmvuln.xyz/#signature",
   "bytes": 7408
  },
  {
   "id": "spiro",
   "number": 72,
   "name": "Spirograph",
   "technique": "Hypotrochoid",
   "inputs": {
    "pointer": "click for the next gear",
    "touch": "tap for the next gear"
   },
   "description": "A gear rolls inside a ring with a pen through one of its holes. The gear's centre circles the ring while it spins backwards, and the pen traces a looping rosette that closes after a whole number of laps.",
   "try": "Watch it draw. Click for the next gear; move the pen hole with the slider.",
   "details": {
    "Technique": "Hypotrochoid",
    "Laps": "r / gcd(R, r)",
    "Gears": "Six ring and gear pairs"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/spiro",
   "page_url": "https://specimens.llmvuln.xyz/#spiro",
   "bytes": 7006
  },
  {
   "id": "dotmatrix",
   "number": 73,
   "name": "Dot-matrix sign",
   "technique": "Bitmap font",
   "inputs": {
    "pointer": "type a message",
    "touch": "type a message"
   },
   "description": "A scrolling LED sign with a hand-made 5 × 7 bitmap font. Each lamp eases toward on or off, switching on fast and cooling more slowly, so lit dots trail a little behind the scroll.",
   "try": "Type a message and press show.",
   "details": {
    "Technique": "Bitmap glyphs, one bit per lamp",
    "Font": "5 × 7: A–Z, 0–9 and punctuation",
    "Lamps": "On in about 25 ms, off in about 110 ms"
   },
   "family": "type",
   "source_url": "https://specimens.llmvuln.xyz/s/dotmatrix",
   "page_url": "https://specimens.llmvuln.xyz/#dotmatrix",
   "bytes": 7191
  },
  {
   "id": "magnetic",
   "number": 74,
   "name": "Magnetic buttons",
   "technique": "Spring offset",
   "inputs": {
    "pointer": "approach a button",
    "touch": "drag near a button"
   },
   "description": "Buttons lean toward your pointer when it comes close, and their labels lean a little further, which gives each one a sense of depth. A spring pulls them home when you move away.",
   "try": "Move your pointer near any button, then away.",
   "details": {
    "Technique": "Custom properties driven by a spring",
    "Reach": "80 px past the button edge, at most 12 px of travel",
    "Label shift": "40% of the button's shift"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/magnetic",
   "page_url": "https://specimens.llmvuln.xyz/#magnetic",
   "bytes": 5383
  },
  {
   "id": "scrolling",
   "number": 75,
   "name": "Scroll-driven cards",
   "technique": "Scroll timeline",
   "inputs": {
    "pointer": "scroll inside",
    "touch": "scroll inside"
   },
   "description": "Cards rise into place as they scroll into view, and a bar tracks how far you've read. It's all CSS with no JavaScript, using scroll-driven animations.",
   "try": "Scroll inside the stage.",
   "details": {
    "Technique": "animation-timeline: view() and scroll()",
    "JavaScript": "None",
    "Support": "Chromium and Safari 26+; elsewhere the cards appear without motion"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/scrolling",
   "page_url": "https://specimens.llmvuln.xyz/#scrolling",
   "bytes": 4750
  },
  {
   "id": "morph",
   "number": 76,
   "name": "Card to detail morph",
   "technique": "View transitions",
   "inputs": {
    "pointer": "open a card",
    "touch": "open a card"
   },
   "description": "Click a plate and its pattern and title glide into the detail view as one continuous shape. The browser snapshots both states and animates between them.",
   "try": "Open a card, then go back.",
   "details": {
    "Technique": "document.startViewTransition()",
    "Shared elements": "Pattern plate and title",
    "Fallback": "Instant swap where unsupported"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/morph",
   "page_url": "https://specimens.llmvuln.xyz/#morph",
   "bytes": 7020
  },
  {
   "id": "odometer",
   "number": 77,
   "name": "Rolling odometer",
   "technique": "Digit strips",
   "inputs": {
    "pointer": "press the buttons",
    "touch": "press the buttons"
   },
   "description": "Each digit is a strip of numbers behind a window. Changing the value slides every strip to its new digit with a little overshoot, the leftmost digits arriving last.",
   "try": "Press the buttons to add to the count.",
   "details": {
    "Technique": "translateY on digit strips, CSS transitions",
    "Digits": "7, leading zeros dimmed",
    "Stagger": "60 ms per digit"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/odometer",
   "page_url": "https://specimens.llmvuln.xyz/#odometer",
   "bytes": 5175
  },
  {
   "id": "rubber",
   "number": 78,
   "name": "Rubber-band list",
   "technique": "Overscroll",
   "inputs": {
    "pointer": "fling · pull past the end",
    "touch": "fling · pull past the end"
   },
   "description": "A list with real momentum. Fling it and it coasts; pull past either end and it resists more and more, then springs back when you let go.",
   "try": "Drag or fling the list, or use the wheel or arrow keys. Pull past the ends.",
   "details": {
    "Technique": "Momentum, rubber-band overscroll, spring return",
    "Friction": "e^(−3.2t)",
    "Return": "Spring k 180, c 26"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/rubber",
   "page_url": "https://specimens.llmvuln.xyz/#rubber",
   "bytes": 7495
  },
  {
   "id": "toggles",
   "number": 79,
   "name": "Toggle personalities",
   "technique": "Role = switch",
   "inputs": {
    "pointer": "flip each switch",
    "touch": "flip each switch"
   },
   "description": "Four switches with the same job and different characters. One bounces, one stretches with speed, one pours its colour out of the knob, and one turns over like a coin.",
   "try": "Click each switch, or tab to them and press space.",
   "details": {
    "Technique": "Springs driving CSS custom properties",
    "Semantics": "Real buttons with role switch",
    "Springs": "k 220 to 420 per personality"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/toggles",
   "page_url": "https://specimens.llmvuln.xyz/#toggles",
   "bytes": 6327
  },
  {
   "id": "picker",
   "number": 80,
   "name": "Picker wheel",
   "technique": "Momentum snap",
   "inputs": {
    "pointer": "drag or scroll a wheel",
    "touch": "drag a wheel"
   },
   "description": "A time picker built as two drums in CSS 3D. Each row sits at its own angle round the drum, so turning the drum is a single number. A flick coasts on its own speed, then a spring settles it on the nearest row.",
   "try": "Drag or scroll a wheel, or focus it and use the arrow keys.",
   "details": {
    "Technique": "rotateX drum, momentum, snap",
    "Rows": "20° apart, recycled",
    "Semantics": "role spinbutton with value text"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/picker",
   "page_url": "https://specimens.llmvuln.xyz/#picker",
   "bytes": 6537
  },
  {
   "id": "swipe",
   "number": 81,
   "name": "Swipe stack",
   "technique": "Fling threshold",
   "inputs": {
    "pointer": "drag a card sideways",
    "touch": "drag a card sideways"
   },
   "description": "A deck of cards you sort with a flick. The top card follows your finger and leans as it goes; past a third of its width, or with enough speed, it flies off and the next card rises into place.",
   "try": "Drag a card left or right, or use the buttons or arrow keys.",
   "details": {
    "Technique": "Distance or speed threshold",
    "Threshold": "A third of the width, or 900 px/s",
    "Return": "Spring k 170, c 20"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/swipe",
   "page_url": "https://specimens.llmvuln.xyz/#swipe",
   "bytes": 7313
  },
  {
   "id": "sortable",
   "number": 82,
   "name": "Sortable list",
   "technique": "Spring slots",
   "inputs": {
    "pointer": "drag a handle",
    "touch": "drag a handle"
   },
   "description": "Drag a row by its handle and the others glide out of the way. Every row has a spring toward its slot; the held row follows the pointer exactly and the order updates from where its centre is.",
   "try": "Drag a handle. Or focus a row, press space to lift it, and use the arrow keys.",
   "details": {
    "Technique": "A spring per row toward its slot",
    "Keyboard": "Space lifts and drops, arrows move",
    "Announcements": "Live region on every move"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/sortable",
   "page_url": "https://specimens.llmvuln.xyz/#sortable",
   "bytes": 6223
  },
  {
   "id": "sheet",
   "number": 83,
   "name": "Bottom sheet",
   "technique": "Detent snapping",
   "inputs": {
    "pointer": "drag the sheet",
    "touch": "drag the sheet"
   },
   "description": "A sheet with three resting heights. Dragging moves it one to one, with resistance past the ends. On release it projects where its speed would carry it and snaps to the nearest height, so a flick goes further than a slow drag.",
   "try": "Drag the sheet and let go. Tap the handle, or use it from the keyboard, to step through the heights.",
   "details": {
    "Technique": "Velocity projection to detents",
    "Detents": "Peek, half, full",
    "Projection": "Position plus 0.2 s of speed"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/sheet",
   "page_url": "https://specimens.llmvuln.xyz/#sheet",
   "bytes": 7288
  },
  {
   "id": "hold",
   "number": 84,
   "name": "Hold to confirm",
   "technique": "Press and hold",
   "inputs": {
    "pointer": "press and hold",
    "touch": "press and hold"
   },
   "description": "A destructive button you have to hold. Progress fills only while it's held and drains faster if you let go early, so a slip is easy to undo. The label is drawn twice, one copy clipped to the fill, so it stays readable across the edge.",
   "try": "Press and hold the button, or hold Space or Enter on it.",
   "details": {
    "Technique": "Clip-path fill, doubled label",
    "Hold": "1 second",
    "Release": "Drains 3 times faster than it fills"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/hold",
   "page_url": "https://specimens.llmvuln.xyz/#hold",
   "bytes": 4946
  },
  {
   "id": "tabs",
   "number": 85,
   "name": "Sliding tabs",
   "technique": "Two-edge springs",
   "inputs": {
    "pointer": "pick a tab",
    "touch": "tap a tab"
   },
   "description": "Tabs with two indicators. The pill glides as one shape on a spring. The underline has a spring on each end: the leading end is stiff and leaves first, the trailing end is soft and catches up, so the line stretches mid-move.",
   "try": "Click a tab, or use the arrow keys inside the tab list.",
   "details": {
    "Technique": "A separate spring for each edge",
    "Leading edge": "k 420, c 34",
    "Trailing edge": "k 120, c 18"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/tabs",
   "page_url": "https://specimens.llmvuln.xyz/#tabs",
   "bytes": 5749
  },
  {
   "id": "toasts",
   "number": 86,
   "name": "Toast stack",
   "technique": "Stacked layout",
   "inputs": {
    "pointer": "notify · hover the pile",
    "touch": "notify · tap the pile"
   },
   "description": "Notifications that pile up neatly. Older toasts tuck behind the newest, each a little higher and smaller; hovering or focusing the pile fans it into a list and pauses the timers. Swipe a toast sideways to dismiss it.",
   "try": "Press notify. Hover the pile to open it, then swipe or close a toast.",
   "details": {
    "Technique": "Spring stack, collapsed and open layouts",
    "Life": "5.2 s, paused while open",
    "Limit": "5 toasts"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/toasts",
   "page_url": "https://specimens.llmvuln.xyz/#toasts",
   "bytes": 6717
  },
  {
   "id": "pill",
   "number": 87,
   "name": "Morphing pill",
   "technique": "Size morph",
   "inputs": {
    "pointer": "click to change state",
    "touch": "tap to change state"
   },
   "description": "One container with four faces: a clock, a timer, music and a player. Width, height and corner radius ride springs toward the next face's size, and the new face waits until the shape is mostly there, so content never squeezes.",
   "try": "Click the pill to change its state.",
   "details": {
    "Technique": "Size springs, staged cross-fade",
    "States": "Clock, timer, music, player",
    "Spring": "k 260, c 21"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/pill",
   "page_url": "https://specimens.llmvuln.xyz/#pill",
   "bytes": 6263
  },
  {
   "id": "like",
   "number": 88,
   "name": "Like burst",
   "technique": "Particle burst",
   "inputs": {
    "pointer": "click the heart",
    "touch": "tap the heart"
   },
   "description": "Liking plays three things at once: the heart squashes and springs past its size, a thin ring flashes outward, and a dozen dots fly out on two radii. The count rolls up a line instead of swapping in place.",
   "try": "Click the heart, then click again to unlike.",
   "details": {
    "Technique": "Spring scale, canvas particles",
    "Burst": "A ring and 14 dots over 650 ms",
    "Semantics": "aria-pressed toggle"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/like",
   "page_url": "https://specimens.llmvuln.xyz/#like",
   "bytes": 6000
  },
  {
   "id": "eslider",
   "number": 89,
   "name": "Elastic slider",
   "technique": "Rubber band",
   "inputs": {
    "pointer": "drag past an end",
    "touch": "drag past an end"
   },
   "description": "A volume slider that stretches. Inside the range it tracks the finger exactly; pulled past an end it keeps following with growing resistance, the bar stretching and thinning like a strap, and the icon at that end swells to match.",
   "try": "Drag past either end and let go. The arrow keys bump against the limits too.",
   "details": {
    "Technique": "Rubber-band overflow, return spring",
    "Give": "Up to 40 px, compressed",
    "Return": "Spring k 300, c 16"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/eslider",
   "page_url": "https://specimens.llmvuln.xyz/#eslider",
   "bytes": 6011
  },
  {
   "id": "shuffle",
   "number": 90,
   "name": "Spring shuffle grid",
   "technique": "FLIP",
   "inputs": {
    "pointer": "sort · click a tile",
    "touch": "sort · tap a tile"
   },
   "description": "The tiles really change places in the page layout. Each one remembers where it was, jumps to its new spot, then springs back across the gap so the move looks continuous. This trick is called FLIP.",
   "try": "Shuffle or sort the tiles, or click any tile to send it to the front.",
   "details": {
    "Technique": "FLIP with the Web Animations API",
    "Easing": "Spring baked into CSS linear()",
    "Spring": "Stiffness 170, damping 16",
    "Stagger": "12 ms per tile"
   },
   "family": "interface",
   "source_url": "https://specimens.llmvuln.xyz/s/shuffle",
   "page_url": "https://specimens.llmvuln.xyz/#shuffle",
   "bytes": 5312
  }
 ]
}