Asset Library
1,738 video parts you can take today, and 557 more to learn from. Find one you like, then open it for the details.
Showing 149 of 2,295Show everything
No preview yet · 139
Dolly Zoom (Vertigo Shot)HTML · Apache-2.0Camera tracks toward or away from the subject while the field of view changes the opposite way, so the subject holds its frame size while…Rack FocusHTML · Apache-2.0A focus pull with real aperture bokeh: the focal plane travels from a near subject to a far one, so one resolves as the other blows into…3D UI RevealHTML · Apache-2.0Perspective 3D reveal animation for UI elements.Agent CursorHTML · Apache-2.0An AI agent operating a UI: a cursor with an accent name label that types out each step, clicks each target with a small ring, and ends on…Avatar Group HoverHTML · Apache-2.0A distance-falloff avatar group lift with bouncy hover return. Paste-in snippet: it registers no timeline, you wire it into your own.Badge PopHTML · Apache-2.0A transitions.dev-inspired notification badge pop with elastic scale and count reveal. Paste-in snippet: it registers no timeline, you wire…Camera Rig Depth StackHTML · Apache-2.0A 3D camera-rig-style card stack with depth, parallax, and focus shift. Paste-in snippet: it registers no timeline, you wire it into your…Camera ShakeHTML · Apache-2.0Procedural handheld, telephoto and rig camera shake for any wrapper: nine measured profiles with per-lens projection, closed-form and…Card ResizeHTML · Apache-2.0A transitions.dev-inspired card resize primitive that expands a compact card into a detail panel. Paste-in snippet: it registers no…Context Menu CursorHTML · Apache-2.0A cursor right-clicks a file, a context menu blooms from its tip, the hover highlight tracks the item under it, and the chosen action plays…Drag and Drop CursorHTML · Apache-2.0A cursor grabs a task card, lifts and tilts it into its motion, carries it in lockstep to an empty column, drops it with a small settle…Cursor Glyph TrailHTML · Apache-2.0A tutorial cursor path: on a settings screen the arrow clicks through three steps, leaving a dotted trail spaced evenly by distance and a…Marquee Select CursorHTML · Apache-2.0A cursor drags a selection rectangle across a photo grid; each tile rings and pops a check the frame the rectangle touches it, while a pill…Text Select CursorHTML · Apache-2.0An arrow turns into an I-beam over a document, drags a selection across a phrase character by character, raises a format toolbar, turns…Zoom Follow CursorHTML · Apache-2.0Screen-recording auto-zoom: the camera pushes in toward each upcoming click, trails the cursor on a smooth spring, marks every click with a…Dart CursorHTML · Apache-2.0A bold outlined arrowhead that dives in from camera depth, flies nose-first with motion blur along its path, squashes on two clicks, and…Drift HoldHTML · Apache-2.0A centered content card stays subtly alive through loop-exact rotation, scale breathing, and a slow light sweep.Extended KeyframeHTML · Apache-2.0The never-fully-lands arrival: an element covers most of its move in the first fifth of the duration and creeps the rest to the last frame…Focus RackHTML · Apache-2.0Focus shifts once between two cards at different apparent depths through synchronized blur, dimming, scale, and parallax.Focus SwapHTML · Apache-2.0Moves attention between two side-by-side cards as one recedes with scale, blur, and dimming while the other advances to full focus.Gesture TapHTML · Apache-2.0A contact circle taps a mobile pill button, releases it into a new labeled accent state, and lifts away.Icon Morph BeatHTML · Apache-2.0An icon morphs between authored state silhouettes, shifts to an accent color, and marks completion with one restrained pulse.Icon SwapHTML · Apache-2.0A scale-and-blur icon swap primitive for toolbar and action state changes. Paste-in snippet: it registers no timeline, you wire it into…Input FeedbackHTML · Apache-2.0A transitions.dev-inspired input feedback primitive with shake, clear affordance, and success state. Paste-in snippet: it registers no…Magnetic CursorHTML · Apache-2.0A soft dot pointer glides across an editor toolbar, is pulled into each button and morphs into its rounded hover plate while the icon leans…Menu MorphHTML · Apache-2.0A transitions.dev-inspired hamburger and plus-menu morph primitive for compact action menus. Paste-in snippet: it registers no timeline…Micro TransitionsHTML · Apache-2.0A transitions.dev-inspired pack of badge, dropdown, modal, tabs, tooltip, and success-check micro transitions. Paste-in snippet: it…Modal MorphHTML · Apache-2.0A small card expands into a full panel, shared-element style: both layouts measured once at mount, the container morphs by transform only…Multiplayer CursorsHTML · Apache-2.0Labeled collaborator cursors with token-derived colors and soft glows drift from spread positions into a shared center zone, proving live…Offset Path TravelerHTML · Apache-2.0A slotted traveler follows an authored path with tangent rotation, curved entry, and curved exit.Oversized CursorHTML · Apache-2.0The look-here pointer for a video: the macOS arrow at 3.5x its normal size lands its tip on one control, clicks it on, settles just below…Pan StationsHTML · Apache-2.0A lateral camera move across a continuous row of labeled feature stations, with a steady dwell at each stop before the next pan.Panel RevealHTML · Apache-2.0A panel reveal primitive with height expansion and content fade. Paste-in snippet: it registers no timeline, you wire it into your own.Pendulum SwingHTML · Apache-2.0Content hangs from a fixed pivot and swings into rest with gravity-damped oscillation, like a hanging sign settling on its hook. Paste-in…Physical ExitHTML · Apache-2.0A card exits with physical momentum in toss, drop, or slide mode, carrying acceleration and rotation through the final offscreen pose…Press RippleHTML · Apache-2.0A cursor decel-arrives from off-stage, lands slightly off-center on a caller-positioned target, compresses with it in lockstep, releases…Pull Back RevealHTML · Apache-2.0A tight stat detail holds, then one decelerating camera pull-back reveals the headline and supporting cards that recontextualize it.Pull to RefreshHTML · Apache-2.0A mobile list pulls through nonlinear rubber-band resistance, arms at a threshold, commits to a bounded loading indicator, then snaps…Push InHTML · Apache-2.0A centered headline gains focus through one slow, continuous camera push and a gentle fade out.Scroll Camera StoryHTML · Apache-2.0A compressed forced-scroll cinematic pass: a tall scene of slotted sections travels past the camera top to bottom, depth layers parallax at…Skeleton RevealHTML · Apache-2.0A skeleton loader transition that pulses, then cross-fades into content. Paste-in snippet: it registers no timeline, you wire it into your…Spring PopHTML · Apache-2.0A badge pops in from a visible near-rest scale, overshoots full size once, and settles cleanly.Success CheckHTML · Apache-2.0A success check primitive with ring pop, path draw, and subtle rotate blur. Paste-in snippet: it registers no timeline, you wire it into…SVG Line Draw LoaderHTML · Apache-2.0An Anime.js-style path drawing loader implemented as a seekable GSAP stroke timeline. Paste-in snippet: it registers no timeline, you wire…SVG Stroke TraceHTML · Apache-2.0An authored SVG path draws from its measured length, holds with subtle drift, and optionally fills when the path is closed.Swipe RailHTML · Apache-2.0A contact circle leads a horizontal card rail through a fast drag, momentum carry, and settled snap to the next card.Tabs Slide IndicatorHTML · Apache-2.0A pill indicator transition that slides between active tabs. Paste-in snippet: it registers no timeline, you wire it into your own.Tilt CardHTML · Apache-2.0A transitions.dev-inspired tilt card primitive with depth layers and hover-style parallax. Paste-in snippet: it registers no timeline, you…Touch IndicatorHTML · Apache-2.0A translucent contact-circle gesture actor for mobile UI scenes: it touches the glass on the frame the host target responds, then lifts…UI Focus ZoomHTML · Apache-2.0A full app surface establishes with one settle, then the camera zooms and pans to an anchored region on its cue and holds the zoomed state…Camera Punch-InHTML · Apache-2.0Dynamic zoom, slide, and 3D tilt-pan helpers for any wrapper (video, include, card) with cubic-easing defaults and an edge-defocus pulse…creative/animated-drawingSkill · Link onlyMaking a person's own drawing or photo of a character move (dance, walk, jump, wave) with Meta's AnimatedDrawings and real motion capture…creative/animation-pipelineSkill · Link onlyMotion-graphics basics for the two render paths: choosing Remotion or HyperFrames, frame rate, timing principles and scene transitions.creative/cinematicSkill · Link onlyThe cinematic look: wide aspect ratios, shot length and pacing, layered sound, grading, and replacing mood words with the visual cause of…creative/ink-theaterSkill · Link onlyThe creative method behind Ink Theater: a black-ink character acts out an abstract idea by working an absurd low-tech machine. Gives the…creative/manim-usageSkill · Link onlyUsing Manim for maths animation in this system: render settings, timing, composition and color.canvas-procedural-animationSkill · Link onlyProcedural character effects with p5.js and canvas: particles, weather, squash and stretch, walk cycles.framer-motionSkill · Link onlyDisney's twelve animation principles applied with Framer Motion in React.gsap-coreGSAP · Link onlyGreenSock's own skill for the core GSAP API. A copy of the skill in greensock/gsap-skills, which is MIT.gsap-frameworksGSAP · Link onlyGreenSock's own skill for GSAP in Vue, Svelte and other non-React frameworks. Copy of the MIT upstream.gsap-performanceGSAP · Link onlyGreenSock's own skill for GSAP performance. Copy of the MIT upstream.gsap-pluginsGSAP · Link onlyGreenSock's own skill for the GSAP plugins (SplitText, Flip, MorphSVG and the rest). Copy of the MIT upstream.gsap-reactGSAP · Link onlyGreenSock's own skill for GSAP in React. Copy of the MIT upstream.gsap-scrolltriggerGSAP · Link onlyGreenSock's own skill for scroll-linked animation. Copy of the MIT upstream.gsap-timelineGSAP · Link onlyGreenSock's own skill for GSAP timelines. Copy of the MIT upstream.gsap-utilsGSAP · Link onlyGreenSock's own skill for the GSAP helper functions. Copy of the MIT upstream.hyperframes-animationHTML · Link onlyAll the motion knowledge for HyperFrames: small motion rules, scene blueprints, transitions. Copy of HeyGen's skill.lottie-bodymovinSkill · Link onlyDisney's twelve animation principles applied with Lottie animations exported from After Effects.manimce-best-practicesSkill · Link onlyBest practices for Manim Community Edition. Carries its own MIT license file (Adithya S Kolavi, 2026).manimgl-best-practicesSkill · Link onlyBest practices for ManimGL, the original Manim. Carries its own MIT license file.motion-graphicsHTML · Link onlyShort design-led motion graphics where the motion is the message: kinetic type, number count-ups, chart reveals, logo stings.remotion-best-practicesRemotion · Link onlyAn older copy of Remotion's own best-practices skill with 38 rule files. Upstream (remotion-dev/skills) states no license, and this copy…remotionRemotion · Link onlyProject conventions for Remotion from a third-party video toolkit: custom transitions and shared components.svg-character-animationSkill · Link onlyAnimating SVG character rigs with GSAP, CSS transforms and Remotion frame control.action_timeline_compilerTool · Link onlyCompiles a scene plan into a timed list of character actions and poses. Runs on the machine. Works with no keys.math_animateTool · Link onlyMathematical animation with Manim. Runs on the machine; needs manim. Needs a key, a program or a download before it works.Ink Theater engineHTML · Link onlyA small script for hand-drawn black-ink animation in HTML and SVG on one paused GSAP timeline: wobbly ink strokes, a line 'boil' that is…Twelve motion-capture clipsHTML · Link onlyTwelve 2D motion clips for the puppet: climb, dance_glide, dance_spin, jump, kick, march, run, shuffle, sit, twist, walk, wave. Made from…/ink-artSkill · Link onlySlash command for a hand-drawn ink animation: a character that draws itself and moves, or a contraption explainer, rendered through…/animated-drawingSkill · Link onlySlash command that makes a supplied drawing or photo of a character move with Meta's AnimatedDrawings. Copies for other agents sit in…Shot prompt builderTool · Link onlyTurns structured shot language (camera, movement, subject, lighting and more, in layers) into a prompt tuned for a given video model.action_timeline schemaStarter · Link onlyTimed character actions and poses ready to render. A JSON Schema; required fields: version, scenes.gsap-scrolltriggerGSAP · MITScroll-linked animation for web pages: triggers, start and end, scrub, pinning, batch, horizontal scroll with containerAnimation, markers…gsap-utilsGSAP · MITThe helper functions on gsap.utils: clamp, mapRange, normalize, interpolate (numbers, colors, objects), random, snap, shuffle, distribute…gsap-reactGSAP · MITGSAP inside React: the useGSAP hook from @gsap/react with a scope ref, refs for targets, the dependency array and revertOnUpdate…gsap-frameworksGSAP · MITGSAP in Vue 3, Nuxt 4 and Svelte: create animations after mount inside gsap.context() scoped to the component, revert on unmount, a…examples/vanillaGSAP · MITOne HTML page and one module showing a single tween, a three-step timeline with defaults and position offsets, and a scrubbed ScrollTrigger…examples/reactGSAP · MITA Vite and React page: a box moved with useGSAP, three items staggered in, scoped to a container ref. Pins React 18.examples/vueGSAP · MITA Vite and Vue 3 page: a tween, a stagger and a scrubbed ScrollTrigger timeline inside gsap.context(), reverted on unmount.GitHub Copilot instruction filesSkill · MITThe same guidance condensed for GitHub Copilot, which does not read skill folders: one repo-wide file and two path-specific ones for React…basic-3d-sceneShot recipe · Apache-2.0Impress-style spatial slides: cards sit at scattered 3D poses and the camera flies to align with each one by inverting its transform…cursor-flyoverShot recipe · Apache-2.0After an overview fade-in the camera flies to each of four screen corners in turn while an SVG cursor arrives with it, pointing and leaving…graze-face-tourShot recipe · Apache-2.0The camera skims low across the UI surface like terrain while page text hovers above the interface and settles down as the shot advances.overhead-camera-movesShot recipe · Apache-2.02 named moves on one card: tilt-reveal (The whole page lies flat at -80 degrees and tilts upright in one 43-frame ease-out with a slight…steep-tilt-glideShot recipe · Apache-2.0A page stands at a steep 60-degree perspective and glides across a fixed camera with speed ghosting while text settles onto the surface…tension-camera-movesShot recipe · Apache-2.02 named moves on one card: bullet-time-freeze-orbit (A growing chart freezes mid-animation while the camera orbits the hovering UI plane 55…slam-entrance-movesShot recipe · Apache-2.03 named moves on one card: kanada-perspective-snap (Kanada-style snap: perspective 300 to 1500, rotate3d 58 degrees to flat, scale 1.7 to 1…crane-rise-revealShot recipe · Apache-2.0The camera starts tight on one data row, rises and pulls back, then reveals a full dashboard filling the frame.magician-card-flourishShot recipe · Apache-2.0A blue starburst flashes on black for a third of a second, then a card shoots out of the flash, spinning along an arc toward camera before…avatar-bracket-carouselShot recipe · Apache-2.0A four-corner focus bracket stays locked mid-sentence while a vertical queue of avatars springs through it three times, each one sharpening…bezier-source-converge-mergeShot recipe · Apache-2.0Four source nodes each draw a thin bezier curve toward one convergence point, then slide along their own curve and shrink as if swallowed…cloner-depth-echoShot recipe · Apache-2.0A card duplicates into a diagonal depth trail, holds briefly, then accelerates back into one springy original.doc-park-left-pill-dealShot recipe · Apache-2.0The source document slides left until only a sliver remains and keeps scrolling slowly, while three outlined pills are dealt one at a time…list-revealShot recipe · Apache-2.0Menu rows scale into place one after another with a faint overshoot while the whole list drifts slowly upward, keeping the per-item…research-card-stack-scrollShot recipe · Apache-2.0Dark paper cards drop into the center every twelve frames and pile along a downward-right axis, squashing on landing while only the topmost…wall-reveal-movesShot recipe · Apache-2.02 named moves on one card: bento-light-up (A dark 3x2 bento wall waits dimmed; amber light traces each cell border and the content…PageCamRemotion · Apache-2.0A 2.5D camera over a full-page screenshot: you give keyframes (frame, center x/y, zoom, tilt) and it flies the page. The base of every…helpers (rand, shake, camera, motion)Remotion · Apache-2.0Small pure functions with unit tests: seeded random (mulberry32), velocityAt, lagged follow, dampedSettle, handheld shake, and a three.js…PageCam2D.tsxRemotion · Apache-2.0A self-contained copy of the template's page camera for demos that fly over real screenshots (spotlight-hero-card, type-and-filter…M.cursor and M.pressGSAP · Apache-2.0A cursor that enters oversized, parks, then presses: the cursor squashes for 2-3 frames and the target answers a frame later.M.enter and M.exitGSAP · Apache-2.0Entry and exit with a start or end pose and a directional smear that is strongest on the first (entry) or last (exit) frame.M.camera, M.snap, M.whip, M.dive, M.driftGSAP · Apache-2.0Five camera moves on a wrapper element: keyframed camera, a snap that covers most of its distance in one frame then tails off, a whip pan…M.kf, M.show, M.hide, M.cutGSAP · Apache-2.0Frame-numbered keyframes on any property, hard show/hide, and a cut that swaps scenes on one frame and records the cut for the sound mix.M.cascadeGSAP · Apache-2.0Runs one move across several elements with chosen frame gaps and returns the onset frames.M.ease.cruiseGSAP · Apache-2.0Measured ease: linear; 9 frames typical; 18% of measured moves. Used for fades, drift, camera creep, counters, anything ambient.M.ease.glideGSAP · Apache-2.0Measured ease: gentle ease-out (about sine.out); 10 frames; 14%. Used for all-purpose medium lands, camera pushes, press-down.M.ease.softInOutGSAP · Apache-2.0Measured ease: S-curve; 9 frames; 14%. Used for opacity and blur ramps, ground and color changes, a number tied to a handle.M.ease.softLandGSAP · Apache-2.0Measured ease: strong ease-out (about power 3); 12 frames; 9%. Used for the workhorse entry: text rises, panels slide, scale-ins.M.ease.gentleInGSAP · Apache-2.0Measured ease: ease-in (about power 2); 9 frames; 9%. Used for exits, blur-out and fade-out starts, slow push-ins that run into a cut.M.ease.snapSettleGSAP · Apache-2.0Measured ease: 54% done at a tenth of the time, then a long soft tail; 11 frames; 6%. Used for hero entries, logo crash-ins, card landings…