@remocn

Per-character fade-in with a gentle blur and upward motion. Apple's signature hero-title reveal.

Letters slide up from below with no blur — crisp, deliberate, kinetic.

Letters rise from below in a pronounced staircase, one symbol at a time, with zero blur.

Letters descend from above in a pronounced staircase, one symbol at a time, with zero blur.

Words pop in with a soft overshoot scale, like a physical spring settling into place.

A calm, tiny scale pop used as subtle premium polish for labels and headings.

Subtle premium settle-in with a restrained scale-down fade on exit.

Words arrive clean and depart upward with increasing blur for airy exits.

A premium focus pull from heavy blur to crisp text, then a soft blur-out exit.

Each line enters from the left with a staggered slide and exits to the right for a flowing paragraph reveal.

Words gently fade into place one after another, with a short vertical drift for a calm keynote rhythm.

A Material-style content transition: old fades out, new fades in with a soft delay.

Per-word hard-cut transition with staircase timing for sharp editorial swaps.

Scale-based shared-axis transition for focus shifts and context depth.

The whole phrase glides in from the left as one compact move while words reveal in sequence through opacity.

A word appears in the center; each new word enters from the right and pushes the line until the full phrase locks centered.

Each new word drops in from above into its own line and pushes the stack downward until a centered three-line composition locks in place.

Character-by-character text reveal with a deterministic blinking cursor.

Animates one word inside a sentence from a base color to a brand color.

Draws a strike line across old text then reveals new text in its place.

Words fade in and slide up one after another with a configurable delay.

Lines reveal upward with a soft masked feel and compact stagger.

Letter-spacing collapses and blur clears with a springy motion.

Light shine sweeps across muted text via background-clip:text.

Colored marker block draws behind a phrase as the text color shifts.

Vertical reel scrolls characters from one value to another.

Random scramble resolves left-to-right into the target text.

Three RGB-offset text copies jitter for a brief glitch window.

Seamlessly looping horizontal text strip with optional stroke style.

WebGL mesh gradient backdrop driven per-frame for deterministic Remotion renders.

Grainy multi-stop gradient that drifts slowly with film-grain texture over the blend.

Domain-warped color field that folds and stretches like liquid.

Concentric bands swirling around a center point.

Caustic water-surface ripples with subtle refraction.

Rotating spiral arms radiating from the center.

Molten metallic surface with flowing specular highlights.

Overlapping translucent color panels sliding past each other.

Organic neural-web noise field that slowly morphs.

Classic Perlin noise clouds drifting across the frame.

Simplex noise flow field, smoother than Perlin.

Animated Voronoi cells shifting and re-tessellating.

Dots orbiting on concentric paths across the frame.

Ordered-dither shading over an animated gradient field.

Volumetric light rays radiating from an off-screen source.

Soft smoke ring curling and dissipating in place.

Organic blobs merging and splitting like lava.

Glowing border frame that pulses around the edges.

Animated mouse cursor moving between waypoints with click ripple feedback.

A swirl shader transition that unwinds open and winds shut to reveal the next scene.

A dithering shader transition that dissolves one scene into the next.

A perlin-noise shader transition that sweeps its noise threshold to dissolve one scene into the next.

A smoke-ring shader transition that expands the ring outward to reveal the next scene.

A grain-gradient wave that sweeps up across the frame, covering the outgoing scene and revealing the next one from below.

A grain-gradient ripple transition that flies the camera through the center of the rings while the next scene approaches from the depth.

A grain-gradient shader transition that disintegrates the outgoing scene into soft grainy shapes and condenses the next scene out of the noise.

A domain-warp shader transition that melts the outgoing scene into a folding color field and straightens back out into the next.

A whip-pan transition that flies both scenes through the frame in one move with velocity-based motion blur.

A dolly transition that blows the outgoing scene past the camera while the next one approaches from the depth.

A rack-focus transition that defocuses the outgoing scene into a bright blur and resolves the next one into focus.

A depth punch-in transition that pushes the outgoing scene through the viewer while the incoming one resolves out of blur.

Cycles a word through a list of values with a 3D rolodex card flip while an invisible sizer keeps the line width and baseline stable.

Swaps a value in place with a vertical slide — the old value exits up as the new one enters from below while an invisible sizer keeps the width stable.

Two-column layout where chat shrinks and preview expands.

Line chart whose SVG path draws on from left to right with a leading dot.

Bars spring up from the baseline in a staggered cascade.

Terminal window that types out commands and rolls old lines off the top.

Camera locked to the typing cursor, dollying across a terminal as a command types at high zoom.

Multi-step pipeline with sequentially activating nodes and filling lines.

Glowing data packets travel along SVG bezier pipes between system nodes, leaving fading trails.

A premium frosted-glass code editor window with a regex tokenizer and line-by-line stagger reveal.

A camera that scans a glass code block top to bottom as it types, then pulls back to a centered hold.

A 3D-tilted infinite marquee with depth-of-field blur on items rolling toward the horizon.

A central logo orbited by integration satellites with pulsing data lines.

Split-screen where typed code on the left snaps a live UI preview on the right, HMR-style.

A camera diagonally drifts across an oversized bento grid behind a soft vignette.

Self-drawing Sponsors heart that docks to a header, every sponsor avatar blur-staggering into a grid, then a thank-you headline and a CTA. Single seek-safe tim…

Inertial fly-through of a repo's stargazers with a synced count-up odometer that locks on the total. Horizontal 16:9 or vertical 9:16.

Mechanical odometer that rolls an integer up or down to its target, direction inferred from the values.

Odometer where every place rolls at its own speed, new places rising into view, settling exactly on the target value.

Animated X profile follow card — spring bounce-in, staggered blur-in, a synthetic cursor that clicks Follow and flips it to Following. Light/dark, horizontal o…

X follow notifications cycle through as 3D flipping text — '<name> followed you · 7h' — then the total follower count pops in with a confetti burst. Hardcoded …

Animated Claude chat input — types a prompt character-by-character and the waveform button morphs into a terracotta send button the moment text appears. Warm l…

Animated ChatGPT composer — types a prompt into the pill input, the blue voice button morphs into a send button, and the suggestion chips fade out. Light/dark …

Animated Vercel v0 composer — types a prompt into the dark textarea and the mic button morphs into a send button. Dark/light themes.

Animated Claude Code CLI welcome screen — terminal window with a dashed welcome box, recent activity and what's new panels, and a prompt line that types a comm…

Animated OpenCode TUI welcome screen — two-tone wordmark, an input box with a blue accent bar that types a query, a model status line, and command hints. Dark/…

Deterministic confetti burst for Remotion — seeded particles with gravity, spin, and flutter so every render is identical. Fire it on any frame as a celebrator…

Configurable full-frame background (color / gradient / image / live component) with Screen Studio-style padding and a rounded, shadowed content frame.

A slow linear camera push-in wrapper that scales its scene from 1 to 1+grow across the sequence so no frame is ever static.

A stacked group of round brand chips that spring in one-by-one, then hold. Swap the logos to feature any set of marks. Horizontal or vertical stacking.

Handwritten text laid down letter by letter on a quantized stop-motion clock, each glyph keeping its own slant and baseline wobble.

A hand-dragged brush underline that sweeps itself across in a few stop-motion poses, thinning to a dry tail.

Per-pose reshoot jitter that makes any content feel hand-placed on a desk.

A hand-drawn brush arrow that sweeps itself from one point to another, thickening into the head that pops on the final poses.

A taped paper chip that slaps onto the scene over two stop-motion poses, keeping a hand-placed tilt and per-pose wobble.

An instant-photo frame with a handwritten caption for video, images, or live compositions.

A number that counts up in stop-motion poses, rewritten by hand at every pose and freezing still once it lands.

Variable-width brush ribbons for Remotion. Pressure taper, grain displacement, and spine samplers shared by the ink marks.

Crushes an element into a ball of paper and throws it out of frame on an arc, leaving the scene around it running.

A brush circle swept around a region of the frame, opening thin and closing thick, with grain breaking up the dry opening.

A handwritten checklist that writes itself out in full, then ticks and strikes through every done item, one at a time.

The exiting scene swings up and away like a notebook page in stop-motion poses, staying above the scene it reveals.

Quantized stop-motion clock for Remotion. Stepped frames, stepped springs, deterministic hashing, and per-pose paper jitter.

Dissolve one scene into the next through a drifting field of ASCII glyphs.

Sweep a typing caret across the frame, wiping the outgoing scene into the next.

Scatter a field of icons over the cut, hiding the scene swap at the field's peak.

A field of refracted light — the bright filaments light makes through a rippling surface.

Paper's Gem Smoke shader driven by the frame — smoke flowing behind and inside a glassy logo.

Fine horizontal sediment layers displaced by fbm noise, each drifting at its own depth.

A woven substrate of warp and weft threads crossing on a domain-warped grid, with a travelling sheen.

A fixed centered card where images stack on the z-axis and each blooms open over the last via a centre-out mask.

The motion vocabulary scene content is built from: an exponential travel curve, a separate opacity ramp, three spring easings, and a compressing stagger.

A scene sequencer where the outgoing content is shoved off on an accelerating curve and the next springs in from the opposite edge, on one canvas, with no over…

A scene sequencer where the outgoing scene shrinks away as one group, the stage holds empty for a beat, and the next scene's items land staggered from above-1 …

Shared timeline-fold hook, theme context, and color math for remocn UI primitives.

A deterministic spinning arc that loops on the Remotion frame — a pure motion atom with no state.

A blinking text caret — a controlled vertical bar, or a pure motion atom that blinks deterministically from useCurrentFrame.

A button whose idle/hover/press/loading/success state is a pure function of the timeline; the loading state composes the Spinner motion atom.

A disclosure whose opened/closed state is a pure function of the timeline; the panel reveal, chevron, and background are keyframed presets.

A modal alert dialog whose opened/closed state is a pure function of the timeline; the backdrop dim and popup zoom are keyframed presets. Self-contained — pair…

A modal dialog whose opened/closed state is a pure function of the timeline; the backdrop dim and popup zoom are keyframed presets, with a close button and a p…

A side panel whose opened/closed state is a pure function of the timeline; the backdrop dim and right-edge slide-in are keyframed presets, with a close button …

A bottom panel whose opened/closed state is a pure function of the timeline; the backdrop dim and bottom-edge slide-up are keyframed presets, with a drag handl…

A checkbox whose checked/unchecked state is a pure function of the timeline; the box fill, border, and checkmark draw are keyframed presets.

A radio whose checked/unchecked state is a pure function of the timeline; the ring border and inner dot pop are keyframed presets.

A switch whose checked/unchecked state is a pure function of the timeline; the track fill and sliding thumb are keyframed presets.

A text input whose idle/hover/active/typing/invalid state is a pure function of the timeline; the focus ring, border, caret, and value reveal are keyframed pre…

A wrapper that reveals a single child with blur + opacity + a directional offset; a pure state atom, theme-independent — its context is a motion config (blur/d…

A static layout family for composing labeled form controls, modeled on shadcn's Field: FieldGroup ▸ Field ▸ FieldLabel / FieldControl / FieldDescription. Reads…

A select option row whose idle/hover/press/selected state is a pure function of the timeline; the row background, label color, and check icon are keyframed pre…

A select whose opened/closed state is a pure function of the timeline; the trigger reuses the Button primitive and the reveal panel composes SelectItem rows. T…

A dropdown menu action row whose idle/hover/press state is a pure function of the timeline; the row background and label color are keyframed presets. Composed …

A tabs widget whose active-tab state is a pure function of the timeline; the sliding indicator, label colors, and panel crossfade are keyframed/derived presets.

A dropdown menu whose opened/closed state is a pure function of the timeline; the trigger reuses the Button primitive and the reveal panel composes DropdownMen…

An animated cursor that moves between waypoints, clicks (ripple), and drags. The Cursor renderer is a pure function of a numeric CursorStyle channel; useCursor…

A toast notification whose hidden/visible state is a pure function of the timeline. The Toast renderer is a pure function of a ToastStyle (opacity, translateY,…

A command-palette row whose idle/hover/press/selected state is a pure function of the timeline. Leading icon + label + trailing shortcut kbd. Exports an inline…

A ⌘K command palette whose opened/closed state is a pure function of the timeline; the panel zoom + backdrop dim are dialog-like keyframed presets. The search …

A tooltip whose hidden/visible state is a pure function of the timeline. The Tooltip renderer is a pure function of a TooltipStyle (opacity, scale, translate);…

A progress bar whose fill is a pure function of a numeric value channel (value-channel deviation). The Progress renderer takes a clamped 0–100 value; useProgre…

A shimmer placeholder block — a motion atom (spinner pattern). A directional highlight gradient sweeps across deterministically from useCurrentFrame() and loop…

A skeleton→content crossfade whose loading/loaded state is a pure function of the timeline. The Skeleton renderer is pure (reads no frame); only the composed S…

A slider whose fill is a numeric value channel plus a thumb idle/hover/press channel (dual-channel value-channel deviation). The Slider renderer is pure (clamp…

A combobox whose opened/closed state is a pure function of the timeline; the panel fade/scale/lift are keyframed presets like select. The trigger reuses the In…

A popover/hover-card whose opened/closed state is a pure function of the timeline. The Popover renderer is a pure function of a PopoverStyle (opacity, scale, t…

A right-click context menu whose opened/closed state is a pure function of the timeline; the panel scales from its top-left corner (the click point) with a fad…

A segmented control whose active value is a pure function of the timeline; a raised thumb SLIDES between segments (position + width derived from a float indica…

A horizontal onboarding stepper whose progress is a pure function of a continuous step index (value-channel deviation). Every circle (fill, number, stroke-dash…

Two panels split by a draggable handle, where the split ratio is a numeric channel plus a handle idle/hover/press channel (dual-channel value-channel deviation…

A signup card composition: a real shadcn-style card (header, labeled Full Name / Email / Password / Confirm fields, primary + Google-outline buttons, sign-in f…

An AI prompt composition: a prompt types into the field, the Generate button runs hover → press → loading, a skeleton shimmer reveals, then crossfades into the…

A cursor-driven checkout card: the card and its fields blur-in, then the pointer flips a billing-cycle toggle, types a card number, ticks the terms checkbox, a…

A multi-step onboarding composition: a horizontal stepper advances through panels of input, radio, and switch fields, finishing on a Finish button that runs to…

A two-column settings card: the card and its controls blur-in, then the cursor flips a switch, opens a select, drags a labeled slider, and clicks Save, ending …

A chat message bubble whose hidden/visible state is a pure function of the timeline. The renderer is a pure function of a MessageBubbleStyle (opacity, translat…

A continuous typing animation: N dots bounce with a staggered sine wave. A motion atom — it reads the frame and takes color, size, gap, and speed props, defaul…

A messaging composition: an outgoing message types into the composer, the send button presses, and the bubble rises in; the other side shows a typing indicator…

A Telegram-styled messaging composition: tailed bubbles (white incoming, blue outgoing) with in-bubble timestamps and delivery checks, a header that flips to '…

An iMessage-styled messaging composition: gray incoming and blue outgoing bubbles with tails, an in-thread typing bubble with dots, a Delivered label, and tapb…

Shared animation contract, pure frame-to-phase timeline, and SVG path-draw helpers for remocn icons.

Animated Lucide check icon — the stroke draws on, then stamps with a spring pop to mark a step, task, or claim as done.

Animated Lucide circle-check icon — the ring draws clockwise, the checkmark traces in, then the whole mark pops to confirm a completed or successful state.

Animated Lucide x icon — the two diagonals draw in crosswise, then the mark shakes to punctuate an error, removal, or dismissal.

Animated Lucide activity icon — the pulse line sweeps through like an EKG, popping at the peak. Loops by default.

Animated Lucide triangle-alert icon — the outline draws on, the mark pops in, then the exclamation blinks to flag a risk or warning.

Animated Lucide info icon — the ring draws clockwise, the dot pops and stem draws in, then the dot bobs to draw a gentle, neutral note.

Animated Lucide loader-circle icon — the arc draws on, then spins continuously for a loading or processing beat. Loops by default.

Animated Lucide refresh-cw icon — the two arcs draw on, arrowheads pop, then the whole mark spins in cycles for sync, retry, or up-to-date messaging. Loops by …

Animated Lucide search icon — the lens draws on, the handle extends, then the magnifier sweeps a small scanning path for a search or discovery beat.

Animated Lucide bell icon — the body draws on, the clapper follows, then the bell swings from its mount to signal a notification or alert.

Animated Lucide download icon — the tray draws on, the arrow fades in, then drops into the tray with a squash on impact for a download or export beat.

Animated Lucide upload icon — the tray draws on, the arrow fades in, then launches upward with a spring for an upload, publish, or submission beat.

Animated Lucide copy icon — the two sheets draw back-to-front, then the front sheet lifts and settles to read as a duplicate for a copy-to-clipboard beat.

Animated Lucide settings icon — the gear and center draw on, then the gear turns exactly one tooth for a settings, configuration, or customization beat.

Animated Lucide trash-2 icon — the can draws on, then the lid flips open and the contents vanish for a delete or cleanup beat.

Animated Lucide plus icon — the two strokes draw on, then the mark twirls 90deg with a scale pop for an energetic add or create beat.

Animated Lucide send icon — the paper plane draws on, then darts forward with a wind-up and settles back for a send-message beat.

Animated Lucide heart icon — the outline draws on, then a lub-dub heartbeat pulse for likes, favorites, or built-with-love moments.

Animated Lucide star icon — the outline draws on, then twinkles into place with a small rotate and scale pop for ratings, favorites, or star callouts.

Animated Lucide thumbs-up icon — the hand draws on, then springs up with an approving stamp for positive reviews, approvals, or social-proof beats.

Animated Lucide party-popper icon — the cone draws on, then confetti bursts outward as the cone recoils for launch, milestone, or celebration finales.

Animated Lucide arrow-right icon — the shaft and head draw on, then the arrow nudges forward for CTAs, next-step pointers, or flow direction.

Animated Lucide arrow-left icon — the shaft and head draw on, then the arrow nudges back for back navigation or 'previously' callbacks.

Animated Lucide arrow-up icon — the shaft and head draw on, then the arrow nudges up for growth, improvement, or upward-trend beats.

Animated Lucide arrow-down icon — the shaft and head draw on, then the arrow nudges down for cost/latency reduction beats or scroll cues.

Animated Lucide external-link icon — the box and arrow draw on, then the arrow darts out toward the top-right for 'view on GitHub', external docs, or open-in-n…

Animated Lucide play icon — the triangle draws on, then presses in and springs forward like a play button being hit.

Animated Lucide pause icon — the two bars draw on, then pinch toward each other and settle like a held breath.

Animated Lucide skip-forward icon — draws on, then dashes forward past center and snaps against its end bar.

Animated Lucide volume-2 icon — the speaker draws on, then the two sound waves ripple outward one after the other.

Animated Lucide volume-x icon — the speaker draws on, then the X slashes in and the glyph shakes off the sound.

Animated Lucide mic icon — draws on, then the capsule bounces twice like a level meter picking up voice.

Animated Lucide video icon — draws on, then the lens wedge pans out and snaps back to its shot.

Animated Lucide camera icon — draws on, then the lens blinks shut and open like a shutter firing.

Animated Lucide image icon — the frame draws on, then the mountain redraws and the sun drifts into place like a photo developing.

Animated Lucide chevron-up icon — draws on, then nudges upward with a fading echo.

Animated Lucide chevron-down icon — draws on, then nudges downward with a fading echo.

Animated Lucide chevron-left icon — draws on, then nudges left with a fading echo.

Animated Lucide chevron-right icon — draws on, then nudges right with a fading echo.

Animated Lucide menu icon — the three bars slide in from the left, top to bottom, each overshooting into place.

Animated Lucide more-horizontal icon — three dots pop in, then do a left-to-right thinking wave.

Animated Lucide maximize icon — four corner brackets draw on, then fly outward and spring back like a window going fullscreen.

Animated Lucide layout-grid icon — four tiles draw on, then re-pop into place clockwise like a dashboard assembling.

Animated Lucide pencil icon — draws on, then scribbles: the pencil rocks around its tip as if writing.

Animated Lucide share-2 icon — three nodes draw on, then the connections re-trace and the receiving nodes pop as the share lands.

Animated Lucide filter icon — the funnel draws on, then gives two quick shakes as results fall through.

Animated Lucide eye icon — draws on, then blinks once and refocuses its pupil.

Animated Lucide eye-off icon — the eye fragments draw on, then the slash cuts through and visibility dims.

Animated Lucide rocket icon — draws on, then lifts off: the ship rises on a tilt while the flame re-ignites, then eases back to rest.

Animated Lucide save icon — the disk draws on, then presses down and writes: the label slot re-draws as data commits.

Animated Lucide link icon — two chain halves draw on, pull apart, and click together.

Animated Lucide bookmark icon — draws on, then drops into place from above with a spring landing.

Animated Lucide lock icon — the body draws on, then the shackle lifts and slams shut with a confirming pop.

Animated Lucide key icon — draws on, then turns in an invisible lock and springs back.

Animated Lucide log-out icon — draws on, then the arrow steps out through the door frame with a fading echo.

Animated Lucide mail icon — the envelope draws on, then the flap re-traces open and the whole envelope pops: you've got mail.

Animated Lucide message-circle icon — the bubble draws on, then inflates from its tail like a message arriving.

Animated Lucide phone icon — draws on, then rings: three decaying rotation oscillations around center.

Animated Lucide at-sign icon — the inner 'a' draws and pops, then the outer swoosh re-traces its tail: a mention landing.

Animated Lucide inbox icon — the tray draws on, then dips under the weight of an arriving item and springs back.

Animated Lucide shield icon — draws on, then braces: a firm guard pulse that asserts protection.

Animated Lucide help-circle icon — the ring draws on, then the question mark re-draws and tilts like a curious head.

Animated Lucide plus-circle icon — the ring draws on, the plus crosses in, then the whole badge pops.

Animated Lucide x-circle icon — the ring draws on, the X slashes in, and the badge shakes once: firmly rejected.

Animated Lucide calendar icon — the pad draws on, then the binder rings dip and the page snaps into place.

Animated Lucide clock icon — the face draws on, then the hands sweep through discrete ticks. Loops by default.

Animated Lucide timer icon — draws on, then the start button clicks and the hand sweeps: the stopwatch is running.

Animated Lucide home icon — the house draws on, then the door re-draws open and the house settles: welcome home.

Animated Lucide folder icon — draws on, then the folder tips open for a peek and closes.

Animated Lucide file-text icon — the page draws on, then the text lines type themselves in, top to bottom.

Animated Lucide code icon — the angle brackets draw on, pull apart, and snap back around their code.

Animated Lucide target icon — three rings draw in from outside, then the bullseye hits: inner dot pops and the board shudders.

Animated Lucide terminal icon — draws on, then the prompt nudges forward and the cursor blinks twice.

Animated Lucide database icon — the cylinder draws on, then a write lands: the top disc pops and data settles down the stack.

Animated Lucide cloud icon — draws on, then floats: a weightless bob and a half before settling.

Animated Lucide globe icon — draws on, then the meridian sweeps west to east like the world turning. Loops by default.

Animated Lucide monitor icon — the stand draws, then the screen powers on with a CRT-style unsquash.

Animated Lucide smartphone icon — draws on, then buzzes: three fast vibration oscillations.

Animated Lucide sun icon — the core draws on, then eight rays fan out clockwise and the sun swells: sunrise.

Animated Lucide moon icon — draws on, then rocks gently into place: settling in for the night.

Animated Lucide shopping-cart icon — draws on, then rolls forward to checkout, wheels popping as it stops.

Animated Lucide credit-card icon — the card draws on, then the stripe swipes through and the card tips: payment accepted.

Animated Lucide crown icon — descends into place from above, lands with a pop, then rocks regally to rest.

Animated Lucide dollar-sign icon — draws on, then the sign stretches tall: understated cha-ching.

Animated Lucide tag icon — draws on, then swings from its hole like a price tag flicked by a shopper.

Animated Lucide package icon — the box draws on, lands with a squash-and-stretch, then the tape seam seals it.

Animated Lucide gem icon — the stone draws on, then light catches it: facets re-trace in sequence with a flicker and a pop.

Animated Lucide gift icon — draws on, then the lid lifts for a peek and lands with a ribbon pop: almost unwrapped.

Animated Lucide wallet icon — draws on, then the wallet thickens with a quiet x-scale: money in.

Animated Lucide award icon — the medal draws on, the ribbon unfurls beneath it, then the medal swings to rest.