{"uid":"cap_gxvHeFQmo-6G0ldC_6RKO","slug":"eg-pie-web-effect-replicator-hf-space-web-element-motion-4f3e32ab","name":"Web Element Motion Characteristics Extractor","description":"Visits a URL in headless Chromium (multi-cohort optional), scopes to the requested element, and returns the captured MOTION CHARACTERISTICS: CSS @keyframes, WAAPI runtime entries, IntersectionObserver-driven reveals, scroll-timeline params, GSAP/ScrollTrigger config, cursor-tracking patterns, hover-state diffs, and the recurring duration/easing tokens that define the site's motion system. Includes scoped DOM HTML and computed CSS for structural reference. The drop-in `replicaHtml` snippet uses NEUTRAL PLACEHOLDER COPY — agents should substitute their own copy, brand, and visual identity. Verbatim timing/easing values are reproduced (functional properties); copy, logos, and proprietary imagery are NOT.","url":"https://eg-pie-web-effect-replicator.hf.space/v1/element-motion","method":"POST","headers":{},"bodySchema":{"type":"object","required":["url"],"properties":{"url":{"type":"string","format":"uri","description":"Public URL to inspect."},"context":{"type":"string","description":"Free-form natural-language description of WHAT the user wants extracted (\"just the dot-globe\", \"the nav with the dropdown hover\", \"the CTA button\"). Used to refine the snippet output."},"selector":{"type":"string","description":"Optional CSS selector to scope to a single element (\"main > section:first-of-type\", \".cta\", \"#hero\"). Omit to inspect the whole hero region."},"framework":{"enum":["react-tsx","react-jsx","vue","svelte","html-css","framer-motion","gsap","auto"],"type":"string","default":"auto","description":"Target framework for the drop-in snippet."},"colorScheme":{"enum":["light","dark","no-preference"],"type":"string","default":"no-preference","description":"Force prefers-color-scheme during capture (sites often serve different designs by theme)."},"detectCohorts":{"type":"boolean","default":false,"description":"Run a multi-fingerprint pass to surface A/B variants."},"referenceScreenshot":{"type":"string","description":"Optional base64 PNG or https URL. Overrides probe-captured pixels — use when you know which cohort/state you want replicated."}}},"responseSchema":{"type":"object","properties":{"url":{"type":"string"},"fonts":{"type":"array","items":{"type":"object","properties":{"src":{"type":"array","items":{"type":"string"}},"style":{"type":"string"},"family":{"type":"string"},"weight":{"type":"string"}}}},"scope":{"type":"string","description":"The selector that was scoped to."},"assets":{"type":"array","items":{"type":"object","properties":{"url":{"type":"string"},"kind":{"enum":["image","video","font","json","wasm"],"type":"string"},"bytes":{"type":"integer"},"dataUrl":{"type":"string","description":"base64 data URL when small enough to inline"}}}},"motion":{"type":"object","description":"Probe-captured motion data: rankedanimations, motion tokens, detected libraries, hover diffs."},"caveats":{"type":"array","items":{"type":"string"}},"snippet":{"type":"object","properties":{"code":{"type":"string","description":"Drop-in component code."},"files":{"type":"array","items":{"type":"object"}},"imports":{"type":"array","items":{"type":"string"}},"framework":{"type":"string"}}},"capturedAt":{"type":"string","format":"date-time"},"elementHtml":{"type":"string","description":"outerHTML of the scoped element after hydration."},"stylesheets":{"type":"array","items":{"type":"object","properties":{"href":{"type":"string","nullable":true},"text":{"type":"string"},"origin":{"enum":["inline","linked-same-origin","linked-cross-origin"],"type":"string"}}}},"computedStyles":{"type":"array","items":{"type":"object"}},"interactiveCloneUrl":{"type":"string","description":"Optional URL to a hosted offline-running clone (when call also generated a clone bundle)."}}},"example":null,"exampleRequest":null,"tags":[],"displayCostAmount":"0.2","displayCostAsset":"USDC","priceDynamic":false,"priceHint":null,"priceStatus":"priced","priceSource":"settled","requiresHandshake":false,"reviewCount":0,"rating":{"score":"0.00","successRate":"1.00","reviews":0,"stars":null,"state":"rated"},"availabilityStatus":"unknown","priceObserved":null,"sessionDeposit":null,"pricing":{"kind":"static","summary":"$0.2/call","primary":{"kind":"static","protocol":"mpp","network":"tempo","amountUsd":"0.20","per":"call","confidence":"exact"},"accepted":[{"kind":"static","protocol":"mpp","network":"tempo","amountUsd":"0.20","per":"call","confidence":"exact"}]},"paymentMethods":[{"uid":"pm_KjzVjA3edfs20BuGymnuu","protocol":"mpp","methodType":"crypto","chain":"tempo","mode":"charge","costAmount":"0.20","costPer":"request","priority":0,"asset":"0x20C000000000000000000000b9537d11c60E8b50","unit":"request","depositMicros":null,"planRef":null}],"brandName":"eg-pie-web-effect-replicator.hf.space","brandSlug":"eg-pie-web-effect-replicator-hf-space-mpp","brandBaseUrl":"https://eg-pie-web-effect-replicator.hf.space","brandDocsUrl":null,"whatItDoes":"Visits a public URL in headless Chromium, scopes to a specified element, and returns captured motion characteristics (CSS keyframes, WAAPI, GSAP, scroll-timeline, hover diffs, easing tokens) plus a drop-in neutral-copy HTML snippet demonstrating the motion patterns.","exampleAgentPrompt":"Pull the motion characteristics from the hero section of stripe.com — I want the CSS keyframes, easing tokens, and hover-state diffs — and give me a drop-in React TSX snippet with neutral placeholder copy that I can adapt for my own brand.","exampleUseCases":null,"resultDescription":"Returns a structured object containing: captured motion data (ranked animations, motion tokens, detected libraries like GSAP/WAAPI, hover diffs, scroll-timeline params), scoped outerHTML and computed styles, font and asset metadata, a drop-in code snippet in the requested framework with neutral placeholder copy, caveats about capture limitations, and an optional interactive clone URL.","failureModes":["URL is behind authentication or bot protection — headless browser blocked, returns error or empty capture","Element selector matches nothing — scoped HTML and motion data will be empty or fall back to full hero region","Site uses heavy canvas-based animation not expressible in CSS/WAAPI — motion data sparse, caveats populated","Network timeout on slow or large pages — partial capture returned with caveats","Page requires interaction (click, scroll past fold) to trigger animations — some keyframes may be missed","Invalid URL format — schema validation error before any capture occurs"],"whenToPreferThis":"Choose this endpoint when you need structured, machine-readable motion characteristics (timing, easing, keyframe stops, animation library config) from a specific element on a live website, especially when you want a ready-to-adapt code snippet. Prefer over a full site-clone endpoint when you only need one component's motion data rather than the entire page bundle, and over manual inspection when you need the output in a programmatic format an AI agent can reason over.","instructions":null,"reviewSummary":null,"reviewSummaryHighlights":null,"reviewSummaryConcerns":null,"reviewSummaryGeneratedAt":null,"activationCount":1,"lastUsedAt":"2026-06-23T20:40:34.825Z","lastSuccessfullyRanAt":"2026-06-23T20:40:34.825Z","lastHealthCheckAt":"2026-09-14T21:03:39.579Z","isFirstParty":false}