Remotion video components for React: animation and motion graphics for product demo videos. Text reveals, karaoke captions, device mockups, logo stings and full scenes, owned as source.
An agent conversation, from the empty field to the answer. Five beats on one clock: the prompt types itself into a compose field while the camera pushes in, the field scrolls under a soft left edge as the text outgrows it, the message goes and becomes a bubble, an avatar and a typing indicator arrive, and the reply streams back a word at a time — each word grey for a moment before it sets. Only the typing rate is a real decision; every later beat is derived from it.
A line assembles a word at a time, resolves to your product's name, and becomes a prompt somebody types. Each new word's letters arrive at their own heights and fall into the baseline together; the name cuts in hard under a colour ramp that sweeps across it; then a caret types the wrong thing, deletes it, and types the right thing, with the last words landing inside a highlight that sweeps off to the right and hands them back at full size. Four acts in 4.8 seconds. Every beat is a prop.
An agent narrating its own work: the prompt lands in a pill, and under it a log writes itself one line at a time — each step running with a faint spinning globe, then flipping to past tense behind a check while the whole column steps up a row so the live line always sits on the centre. When the work is done the column swells and clears, and the last line slides to the middle and becomes the answer. Every proportion and every curve is fitted from frame measurements.
A four-shot launch title: the eyebrow rushes past the camera on a receding type plane and lands on a colour field, the name assembles word by word on paper, and a macro pan across the tagline cuts wide as the line builds itself last word first while a white sweep drains it out of colour. Content, palette and the mark that leads the closing line are all props.
A question in a pill, an answer that writes itself a word at a time, and then the beat the whole shot is for: a caret lands mid-sentence and a selection band drags across one statement, wrapping the line the way a real one does — and settles onto the single word that matters. Name the sentence and the word as strings; the run is found in the answer for you, punctuation and all.
The beat after send: a macro shot on the button that cuts — hard, on its fastest frame — to the answer building itself on the page, while the camera pulls back 1.364× about a focal point above the frame to keep up with it. Every word arrives hot and cools to the foreground.
A wordmark that folds into an app, and a camera that flies around it. The mark holds the frame alone, shrinks into the header of a card that builds around it, then the camera dives past the card, rolls, and backs off into a settled front-on framing — while the greeting types, the suggestion chips land one at a time and the input bar arrives. The camera is keyed off the reference's own measurements: its distance from the card's apparent width frame by frame, its roll from a straight-line fit to the card's top edge. Every surface the card paints comes from the design system.
A wordmark builds out of solid blocks — a square scales in, a coloured deck fans out around it and winds back, the stack collapses and stretches into one block per letter, then each block flashes a colour and swaps for its real letterform.
A rail of cards flicked sideways across a tilted plane. The cards do not crawl past on a loop — they are flicked: the rail leaves at speed, decelerates for well over a second and comes to rest about a card further along, the way a carousel behaves under a thumb rather than under a timer. The plane is not flat to the camera either. Measured on a recording's card edges, the horizontal scale grows 0.000825 per pixel of height about the frame's own centre line, so the foot of a card is a fifth wider than its head while horizontals stay horizontal and the type stays upright — which is why a row of plain rectangles reads as a surface receding into the frame rather than as a filmstrip.
A work chat filling itself in, the way the channel actually reads: an avatar, a name in bold, a quiet timestamp and the messages as plain lines under them. Messages land one at a time, a second message from the same person joins the group without repeating the name, and when somebody new starts typing three dots hold their line until the words arrive. The transcript never creeps — it sits perfectly still between arrivals and then scrolls, once, by exactly the room the new line needs, and only when the newest line would fall past the anchor. Every vertical number came off a recording and closes on it: carry the layout's arithmetic across the whole scene and it predicts the last frame's baselines to within a pixel.
A chat thread sending itself — the moment a demo video actually gets shared. Bubbles arrive one at a time and fade up in place; the stack is bottom-anchored so each arrival displaces everything above it, eased, while the whole thread creeps upward underneath so it never looks frozen between messages. The camera pulls back gently across the clip. Messages are a `;`-separated string, so the customizer can edit them.
A grid of cards rushes in under a horizontal smear, settles on five and a label, then the camera pulls back a fraction while every empty cell around them fills in from the middle out and the number jumps. The "and it scales" shot, without a cut — one card is deliberately late to land, which is what makes the entry read as five separate things arriving rather than one picture being pushed in.
A synthetic cursor that walks a path of normalized waypoints over any children and pulses a click ring on arrival. A hand-drawn macOS-style arrow with an outline that keeps it readable over arbitrary footage, or a touch puck — for UI sims, and for recordings whose real cursor never made it into the file.
An X-style follower notification that piles up — avatars stack in and the count explodes, then the row bends into an undulating wave of faces.
A caption line that fills word by word as it is spoken — heavy outlined type that reads on any footage. Three presets: karaoke, highlight (the word rides an accent bar), clean.
MacBook-style laptop that opens, runs a dynamic-island notch notification, then dives the camera into the screen until an image or video fills the frame.
A type specimen on a screen you can see the pixels of. A title accelerates up and out of frame, then lines type themselves a word at a time — each laid out centred at its finished width and revealed left to right while the whole line slides slowly left, so it grows without ever drifting from the middle. Over all of it sits an RGB subpixel grid and a scanline, applied to the whole frame rather than to the glyphs, which is what makes the type read as displayed rather than drawn.
A single ring of image cards revolves around a centred title, then spins inward and drains to the middle — giving birth to a simple logo that slides left as the brand name reveals to its right.
A stack of shots flicked through, collapsing into your mark, and the wordmark landing beside it. One card holds the middle of the frame and cuts to the next shot, each smaller and each held for less time than the last, so the sequence winds itself up instead of running at a constant clip. Nothing cross-fades and nothing tweens between shots — the reference holds each card at a fixed size for its whole beat and then cuts, which reads as a stack of prints being dealt rather than as a zoom. At the end of the run the card cuts to a plain tile with the mark on it, the mark overshoots its resting size by a third and settles in three frames, the tile goes, and the mark steps aside twice to make room for the word.
A field of tiles drifting past a headline while the camera pulls steadily back, so the wall of things-it-works-with keeps arriving from every edge. The pull-back is one linear scale measured at 0.176 per second across every tile; the words do not fade in, they arrive 1.216× large and 4.3px soft and land in 140ms.
Images flip across a central card very fast, the flicker decelerates and fades, and the logo and brand name resolve underneath — a strobe of imagery settling onto the mark.
Three statements, three different arrivals, hard cuts between them. The first is wiped on left to right behind a magenta edge that cools to white, then pushes slowly toward the viewer and slides away mid-motion. The second arrives from the right with its words held apart and the gaps close as it lands — nothing scales, only the spacing moves. The third starts larger than the frame and falls back to a line, losing a fixed share of the remaining distance every frame. Give it three strings; every timing is a prop.
A kinetic headline with a swapping inline image, then a scattered gallery of photos flies in, the camera pushes through it as the background lifts from near-black to off-white, and it lands on a single hero image.
An image-universe hero: a continuous stream of photos flows along an Archimedean spiral (a vortex) from the frame edges into the center — evenly spaced by arc length, shrinking and rotating to follow the coil, with the title held in the clear middle. A slow, cinematic opener for launch and editorial videos.
iPhone-style device frame with a dynamic island and a screen slot — flat or lightly 3D-tilted, with rise, rotate-in, or float entrances and a subtle float loop.
One phrase comes apart and another gathers out of the pieces. The opening line holds, its letters fly outward, and at the peak the scene cuts — identity, position and size all change on one frame — then the closing phrase gathers back over twice as long, its letters arriving at different depths and a couple of them landing late. Two phrases in, 51 frames out. Any two strings, any two lengths.
Cinematic product-launch hero — two cards slide into formation as the headline reveals above.
A composer that unrolls from a hairline, writes a brief into itself while the camera cuts in and rides the caret, then cuts back out to the send button as a pointer arrives and clicks it. The typing is eased, not constant — 17 chars/sec on the first word, 33 in the middle, a settle on the last three. Long copy scrolls the field under its own caret and extra suggestions wrap, so the panel fits whatever you put in it.
An assistant landing screen that offers its suggestions, then cuts — hard, in a single frame — into the caret, where the prompt types itself. The push-in is a measured 2.547× anchored on the text insertion point, not an animated zoom.
Glowing 'AI is working' frame — a soft pulsing border overlay that breathes around the scene edges while a response streams.
A run of full-frame title cards that cut hard between beats. A statement card is flicked in from the left line by line and settles on a critically damped curve, then rushes past the camera; a hero card punches its words up from a third of their size in a wave and pushes slowly forward until it cuts. Every curve is fitted from frame measurements — the slide to 0.42px rms over 37 frames.
A sentence set enormous and read a word at a time. Three lines pan left together in eased steps — each step carries the next word to a fixed reading position, decelerating hard into it, dwelling, then accelerating away, the way an eye moves along a line rather than a marquee crawling past. Colour does the reading: a word arrives in the accent and resolves to the text colour as the pan carries it through, so any frame says what has been read and what has not. The lines above and below travel with it in grey, clipped by the frame.
Three rows of roster cards stream past a call to action, a pointer walks in and clicks it, and the monograms start turning to the accent one every seven frames — top row, middle, bottom, top, bottom, middle, so it reads as a system granting rather than a list iterating. The camera and the middle row's clearance around the pill settle on the same measured exponential; the outer rows deliberately do not, which is what stops the two sides ever looking symmetric.
The treatment that turns a raw screen capture into a shot: crop the browser and OS chrome off each edge as a fraction, fit what is left to the frame, and run a keyframed camera that pushes in on whatever matters at a given frame and holds until the next move. Takes a video or a still through the same track.
A search field wider than the shot: two thirds in frame, then it comes forward, types across its left half, pages to its right half, and goes back. Every proportion is measured, and the scale pivots on the text baseline so the type never climbs the pixel grid.
A sentence setting itself, a word at a time. Each word arrives grey and a few pixels right of where it belongs, then darkens to black as it closes the gap — one settle driving both. The cadence decelerates, gaps doubling as the line goes on, so the sentence opens in a rush and lands hard on its last word before the next line starts the rhythm again. Laid out and centred once, so nothing already set moves under the reader.
A wall of work sliding to a stop behind a headline. The whole scatter arrives from the right and settles, losing a fixed share of the remaining distance every frame — no overshoot, just something heavy coming to rest. The headline never moves: it sits in a band the cards are laid out to avoid, so the type is readable on every frame. The cards are drawn rather than photographed, so the component ships with no hosted assets to break.
Shared timeline-fold hook, theme context, and color math for snapcn UI primitives.
A centred line whose status pill cycles: the label rolls up behind a hard clip while the pill's width springs past its target and back, and the line re-centres around it. The field then crossfades and a column of chips steps up from below. Copy, palette and every timing are props; the curves are fitted from frame measurements, not eyeballed.
A word that will not stop, and the line that follows it. "And more" says itself normally, then the letter you name starts repeating — moore, mooore, moooore — until the line is wider than the frame and drags itself off the left edge. Then the closing line arrives a word at a time, sliding back to centre as it goes. The repeat happens inside the word, not appended: "moooore" is somebody leaning on a key, "moreooo" is a typo.
Terminal window with chunked command playback, freeze-frame pauses, step scrolling, and an optional cursor-pinned zoom camera.
Words enter one at a time while already-placed words physically reflow to stay centered — a growing line on the x axis or a growing stack on the y axis.
Animated emphasis on one span inside a static sentence — marker sweep, color shift, underline, strikethrough-replace, or shimmer.
One staggered enter/exit text animator: fade, slide, blur, scale, mask and tracking effects over character, word, line or block units, with 14 classic looks as presets.
A line that writes itself a word at a time, comes forward and gets selected — then its opening is swept away by a clip that cuts letters in half as it passes, and a new ending is written on while the line slides to its new centre. The mark rides the sweeping edge throughout.
A line that writes itself a word at a time — each one arriving in the accent and cooling to the foreground a beat later, so exactly one word is ever coloured — then pushes forward to full size on a baseline-pivoted scale and gets selected, the drag sweeping across under a gradient sheen with a hard caret edge.
Replaces one line of text with another using exit-then-enter scheduling, with five transition presets: fade-through, crossfade, shared-axis-y, shared-axis-z, and cut.
A title reveal where the lead word floats toward the viewer and hangs there while the sentence assembles around it — each trailing word pushes in and its letters bounce up off the baseline in a wave — before the whole line falls back to size.