Changelog

Seven components ported from finished motion-design tutorial reproductions — six typography moments and one full-optics transition. Each one is a technique that has no CSS primitive: mesh warps, gooey thresholds, projective corner pins, morphological extrusions, glass displacement and glyph-level deformation, all rebuilt on deterministic Remotion math.

New components

• Kinetic Warp — a coarse mesh warp bends a whole word in staccato beats, one axis per keyframe. The text never moves; a 2×4 grid does, and two monotone splines resample the canvas so the word bends without folding through itself. Inspired by P A N T E R's kinetic warp tutorial.
• Lens Zoom — a hard cut disguised as a lens punch-in: barrel distortion, fading zoom blur, chromatic split and camera shake around the splice. A full TransitionSeries presentation; the cut lands exactly halfway through. Inspired by Creative Dojo.
• Gooey Morph — bars fly in Tetris-style, land as a row, and melt into a word. The melt is blur-the-alpha-then-threshold: where shapes sit close, their blurred edges add up and paint a solid neck between them. Inspired by Mapal.
• Perspective Squeeze — two lines of heavy type endlessly trade height while a true projective corner-pin bends the flat stack into receding planes. A 225-frame loop that ends where it starts. Inspired by Mapal.
• Extrude Pop — a flat word pops up out of the plane on a solid colored 3D body, no camera involved. The body is the glyph swept along the extrusion vector; long text auto-shrinks to fit. Inspired by Mapal.
• Chromatic Wave — a soft wave travels down through the type; where it crosses, the letters ripple and split into RGB fringes, then settle back to white. Three displacement depths, one per channel, summed back with screen blending. Inspired by Mapal.
• Stretch In — letters fly in from off-canvas and smear horizontally on the way. A vertex-lag deformation on real glyph outlines parsed with opentype.js: the leading edge lands first, the trailing edge catches up, and stems never change width. Works with any text and any font file. Inspired by Ben Marriott.

Every transition in the catalog so far animates a scene from the outside — opacity, transform, filter, or a layer drawn over the cut. None of them could touch the pixels of the scenes being blended, which is why the effects real video editors are known for — tearing, burning, shattering — were missing. Canvas transitions sample both scenes as textures through the experimental html-in-canvas browser API and post-process them per frame, and this is the first one.

New components

• Glitch Cut — the frame breaks into horizontal slices that slide apart, the colour channels separate, and blocks of the picture corrupt into the wrong scene. Each slice hands over to the incoming scene on its own beat around the midpoint, so the cut is torn rather than flat. Built for short timings — 12 frames is the recommended default.
• Ember Burn — the outgoing frame catches fire where it is brightest, so a headline burns away before the background it sits on. Ahead of the flame the picture boils in the heat; at the rim it chars to black; behind it the frame blows away as sparks that carry the colour of the pixels they destroyed. Remotion's own filmBurn() is a different thing — a full-frame warm flash that never consumes the frame and never looks at what is in it — and the two can live in one project.
• Particle Dissolve — the frame is ground into fine dust. Each speck wanders away from the pixel it came from, and how far it gets is set by that pixel's brightness, so highlights and text disintegrate before flat background does. Colour drains out of the grain as it flies, red and blue fringe apart, and then the whole motion reverses and the next scene gathers out of the same dust.
• Grid Wave — a wave travels across the frame and wherever it passes the picture divides into cells that rise off the surface as solid blocks: a lit top face carrying its piece of the picture, a shaded side extruded below it, blocks occluding each other by height. Each block goes up with the outgoing scene and comes down with the incoming one, the hand-over hidden at the crest. Blocks rise from their own footprint, so the frame stays anchored while the wave travels through it, and nothing fades.
• Displacement — the frame divides into a grid and every cell shears out of place at once, each on its own beat: the picture inside a cell slides away from where it belongs, its red and blue channels separate along the direction of travel, and film grain settles over the distortion. At the peak the cells hand over and slide back into register on the next scene.
• Canvas Presentation — the shared scaffolding behind the category, installed alongside any canvas transition. It owns the support check, a full-screen WebGL2 scene shader that receives both sides of the cut as textures, and the routing that swaps in a CSS fallback where the browser has no html-in-canvas.

Improvements

• Canvas transitions never present a broken demo. In Chrome 149+ with chrome://flags/#canvas-draw-element enabled you get the real pixel effect; in Safari, Firefox, and Chrome without the flag the presentation degrades to a CSS approximation of the same edit, so docs previews stay live and your video still renders. Rendering runs through the CLI, Studio, Lambda, and SSR with --gl=angle, or --gl=swangle without a GPU.
• Output is deterministic by construction. Displacement, corruption, and the per-slice handover all come from a hash seeded on the slice index and on a clock derived from the transition's progress — no wall-clock time, no state between frames — so parallel and server-side renders come out seam-free.

The first seven filters were looks you put on a scene deliberately — tape, a tube, print, water. This next run is quieter and aimed at the thing most demos actually need: making a recording stop looking like a render. It starts with the lens.

New components

• Camera Lens — a scene put behind real glass. Resolution falls off toward the corners while the middle stays fully sharp, highlights bloom out into what surrounds them, colour fringes where the channels stop agreeing at the edges, and light drops away on the cos⁴ curve real optics follow. The obvious way to build a lens is to bend the frame, but bending is what a tube does — what separates glass from a display is light, not geometry, so distortion starts near zero and the defaults are made of softness and bloom. Quiet enough to leave running under a whole demo; you notice it by switching it off.

• Security Cam — a scene run through a cheap recorder. Macroblocks flatten where the bitrate could not keep up, colour collapses onto blocks twice the size of the brightness blocks, blacks crush, the exposure hunts and noise crawls in the shadows. The obvious build was a fisheye plus desaturation and it was a trap: bending the frame is what a tube does, and a filter whose identity is a warp reads as crt-screen with the scanlines missing. What makes footage look like surveillance is the codec, not the lens — so that is what this is, and camera-lens still has a distortion prop if you want the wide-angle bow feeding it.

• Hologram — a scene played as projected light. Edges of shapes emit, bright areas throw a halo into what surrounds them, a doubled image shimmers off the original and individual scanlines slip sideways. Tinting a frame and adding lines gets you nowhere near it — three of the four signatures need to read what is next to a pixel, which is the whole reason it lives in this category. Build the console it projects from as ordinary DOM, put your scene inside it, and wrap the lot: the thin lines of a HUD are exactly what the edge emission has to work with.

Improvements

• The filters that could be mistaken for each other are now split by what they are, not by how they look. crt-screen is a tube you watch — uniformly sharp behind a mask. camera-lens is glass you shoot through — sharp in one place and losing resolution everywhere else. vhs-filter is the signal arriving. Each one's avoidWhen names the others, so an agent picking a treatment cannot stack two that tell the same story.

Canvas transitions gave the catalog effects that live at a cut. Filters are the other half of that idea — the same pixel-level treatment, held over a whole scene instead of a dozen frames. A filter is a wrapper: put a scene inside it and every frame of that scene is re-read and repainted, for as long as the scene runs. Where a CSS filter can only blend what is already under a pixel, these write each pixel from somewhere else entirely, which is the reason the category exists at all.

New components

• VHS Filter — a scene held under analog tape. Colour bleeds sideways off every edge while brightness stays sharp, which is what separates tape from a blur; rows wander out of line on a slow drift with per-line jitter on top; the bottom of the frame tears where a real deck switches heads; luma noise and scanlines settle over all of it. Every knob is a plain number, so intensity can be interpolated to let a scene surface out of the wear.
• Underwater Ripple — a scene held under moving water. Every pixel is read through a layered refraction field and the colour channels separate where the water bends hardest, so edges fringe the way light does through a real surface. speed is a count of complete cycles across the composition rather than a rate, which means whole numbers loop with no seam to hide — and inside a Sequence it picks up that sequence's length, so a long ambient hold and a short beat each close on their own. Wrap only the backdrop and your type stays crisp in front of it.
• Halftone Print — the scene put through a press. Cyan, magenta and yellow each get their own screen of dots, rotated to their own angle so the overlap makes a rosette rather than a moiré, and each dot is sized by how much of that ink belongs under it. The three screens land slightly out of register — each colour samples the scene at its own offset — so edges fringe the way real printing does, and paper shows through everywhere the ink does not cover. Feed it something light and graphic; a dark scene saturates every cell and the screen disappears.
• ASCII Render — the scene redrawn as text. The frame divides into glyph cells, each one measures the average brightness of the picture inside it and becomes the matching character from a density ramp, and because the measurement happens every frame the characters flow with whatever moves underneath. Monochrome on black for a terminal, or colored to let each glyph keep the colour of its own cell. intensity blends the text back toward the untouched scene and is read every frame, so a scene can resolve out of ASCII on entry, drop into it on a beat, or sit in it the whole time. It is the sustained sibling of ascii-dissolve — the same alphabet, held over a scene instead of covering a cut.
• Pixelate Region — the practical one. Hand it rectangles in composition coordinates and everything inside them becomes an opaque mosaic, each cell the average of the picture under it, while the rest of the frame stays perfectly sharp. It is built so that failing open is impossible: the mosaic is composited over black at full alpha every frame, the CSS fallback degrades to a plain opaque block rather than an approximation, and passing more regions than can be covered throws instead of quietly dropping one. Record the real dashboard, cover the real key.
• Sustained Glitch — broadcast corruption held over a scene as scheduled bursts rather than a constant texture. Slices tear sideways on their own beats, channels pull apart, and blocks fill with picture dragged in from elsewhere in the frame; a few frames later it has decayed and the scene is untouched again until the next hit. intensity is read every frame, so the damage can be interpolated onto a beat. It is the sustained sibling of glitch-cut — the same look, living between the cuts instead of at one.
• CRT Screen — the scene put behind curved glass. The picture bulges outward so straight lines bow, an RGB phosphor mask breaks the colour into stripes, scanlines follow the curve instead of lying flat, bright areas flood the mask around them, and past the edge of the tube the corners fall away into real darkness rather than a hole. The pair splits cleanly: vhs-filter degrades the signal, crt-screen is the display it arrives on, and they stack.

Improvements

• Filters have their own docs tab, next to Shaders, with a Getting Started page covering what separates a filter from a transition, why the motion inside one never drifts, and how the browser requirement plays out.
• Component metadata gained a third kind of length. Alongside a frame count and state-driven, a component can now declare sustained — it wraps a scene and lasts exactly as long as that scene does. Agents reading /llms-components.txt get the distinction spelled out, so a filter is never handed a Sequence budget or a state prop it has no use for.
• Canvas Presentation now backs both categories. It grew a filter factory beside the transition one: a single-scene shader with the frame and elapsed time bound automatically, and a wrapper that holds each frame until the repaint has actually landed, so a filter's output can never be a frame behind the scene underneath it.

Fixes

• The WebGL scaffolding shared by every canvas effect — program, quad, cached uniform lookups, texture binding, teardown — now exists once instead of once per factory.

Two shapes have been built on html-in-canvas so far, and neither of them can end a scene. A transition needs a second scene to hand over to. A filter is a look that lasts as long as what it wraps, with no progress of its own. What was missing is the shape in between — one scene, one duration, and nothing left afterwards. This is the first of those.

New components

• TV Power Off — a scene switched off the way a tube is. The picture squashes toward the centre line, the line pinches to a phosphor dot, the dot decays and the frame is dead. The tempting build is a scaleY down to nothing, and it produces a shrunken thumbnail rather than a collapse: a real vertical collapse integrates, so every output row here averages the many source rows folding into it and the light they lose is pushed back into what is left. That is what blows the band out to white on the way down, keeps text from aliasing into stripes, and leaves the line carrying the horizontal colour of the columns that fell into it. gain, afterglow and phosphor control the surge, the bleed above and below the line, and the colour of both.

Improvements

• crt-screen now names it in avoidWhen. The two answer different questions about the same object — one is a tube you watch for a whole scene, the other is that tube giving up — and an agent reaching for a CRT should land on the right one.

The page that asks for support should show the project at its best, so the sponsors page was rebuilt around the same craft bar as the components it funds. It now stands on the landing's live NeuroNoise backdrop, the tiers carry their colours, and the wall of love ranks sponsors visually — the higher the tier, the more presence the logo gets.

Improvements

• The hero sits on the landing-style backdrop — dotted grid plus the live NeuroNoise shader — and leads with a "Become a sponsor" call to action; the live-traffic dashboard link moved to a secondary button.
• Tier cards carry a quiet colour system: a per-tier accent hairline along the top edge, a lavender-tinted surface on the Featured tier, and the cursor spotlight now tracks correctly on every card instead of only the first one. The hover lift no longer jitters when the cursor rests near the card's bottom edge.
• The wall of love rewards the tier: Legendary sponsors get a wide full-colour row, Featured logos render in colour, Partners stay muted and reveal their colour on hover, Builders stay compact.
• Cards across the site — sponsors, landing partners, testimonials, showcases, docs galleries — moved from solid borders to layered elevation shadows driven by shared tokens; dark mode collapses each stack to a single white ring. Card hover and focus feedback that was previously dead CSS now works everywhere.
• The billing toggle announces its state to screen readers, keeps a full-size touch target, and its label colour eases in step with the sliding thumb.
• Below-the-fold sections render statically instead of fading in on scroll; the hero intro plays once per session, and prefers-reduced-motion now genuinely disables entrance animations and freezes the NeuroNoise shader.
• Raster sponsor avatars carry the standard 1px inset outline, and all external sponsor logos are self-hosted.

Fixes

• Fabricated bold and italic faces are disabled site-wide (font-synthesis: none), so a missing font weight surfaces as a visible regression instead of a synthetic imitation.
• Section eyebrows follow their documented style — small, mono, muted — matching the hero, and lead paragraphs wrap with text-pretty instead of burning width on balanced lines.
• Sponsor display names use a real muted-foreground token instead of a class that resolved to nothing, so their hover state is visible again.

The docs are becoming the single source of truth for both people and coding agents. Every page now renders to clean Markdown, a new Craft section holds the house rules that used to live only inside the agent skill, and six components that shipped without a page finally have one.

New pages

Six components were installable from the registry but had no documentation. They do now.

• Simulated Cursor — a synthetic cursor that travels between waypoints and fires a click ripple, for narrating a UI on screen
• Strikethrough Replace — strikes through the old text and fades the new text in beneath it
• AI Prompt Flow — a full prompt-to-answer scene, from typing through loading skeleton to the ready toast
• Onboarding Stepper Flow — a stepper advancing through three form panels to a success state
• Field — the static layout family for labeled form controls
• Skeleton Block — the single shimmer rectangle underneath skeleton
• Chat to Preview Layout — a two-column split where the chat column shrinks as the preview expands

New section

Craft collects the rules that decide whether a generated video looks machine-made:

• Design defaults — restraint rules for the text and chrome you add yourself, plus the palette and fonts the library already uses
• Motion principles — the eight classic principles that matter when you assemble scenes from prebuilt blocks
• Anti-patterns — the dozen recurring mistakes with the fix beside each

Improvements

• Appending .md to any docs URL now returns real Markdown. Install commands, prop tables and callouts were previously emitted as raw JSX — the install command was invisible entirely, and heading levels were lost. All of it now renders as headings, fenced code blocks, Markdown tables and blockquotes.
• New /llms-components.txt — every installable component in one table with its use and avoid signal, natural length, vibe, tier and dependencies, linking to each component's full page. It is the entry point for an agent picking components for a scene.
• /llms.txt points at the new component index.
• Every component page now carries that selection metadata, so the index covers the whole catalogue rather than a sample of it.
• CI now fails when a registry component has no docs page, when a page is missing its metadata, or when a page recommends a component that does not exist. The catalogue had drifted silently before this: ten shipped components were missing from the agent's view entirely.
• The agent skill no longer bundles a copy of the catalogue — it reads these docs live. A component added today is visible to an agent whose skill was installed months ago, and a prop can no longer go stale in two places at once. The skill keeps what does not change per component: the two tiers, timing rules, and the recipes for composing a video.

Two grammars for moving between scenes that don't go through TransitionSeries at all. Instead of dropping a presentation between two sequences, a sequencer takes the whole run of scenes and owns the boundary — which is what lets a cut hold the stage empty for a frame, or hand it over with the content still moving.

New components

• Spring Settle — the outgoing scene shrinks away as one group, the stage holds empty for a beat while the background colour changes, then the next scene's items land staggered from above-1 scale. The group transform is the point: scaling elements individually makes multi-line text spread apart as it shrinks.
• Slide Swap — the outgoing content is shoved off on an accelerating curve and is gone before the next frame; the incoming springs in from the opposite edge and brakes into place without bouncing. Horizontal or vertical, on one constant canvas.
• Scene Motion — a small module of the curves scene content is built from, installed alongside Spring Settle. An exponential travel curve, a separate short opacity ramp, three spring easings, and a compressing stagger with deterministic jitter.

Improvements

• Spring Settle's stagger compresses instead of stepping linearly, and carries a deterministic jitter, so a column of items no longer lands on a machine cadence. enterStaggerPower: 1 with enterStaggerJitter: 0 restores the plain linear behaviour.
• Both sequencers render transparent unless you give them a background, so a shader or a Backdrop can sit behind them.

Fixes

• Remotion is no longer pinned to an exact version. All seven remotion and @remotion/* packages now track ^4.0.499 together, which unblocks APIs added after 4.0.473 — Easing.spring among them.

The first stop-motion drop could write. It could not show a list, point at a region of the frame, count, or take anything off the desk — which is most of what a product demo does between its titles. These four fill that in, on the same quantized clock as everything else: ten poses a second, nothing gliding.

New components

• Check List — a list that writes itself out in full, then goes back and closes items: a tick drawn over two poses and the label struck through. The two phases never interleave, because a list you are still writing is not a list you are already crossing off.
• Scribble Circle — a brush loop thrown around the one thing that matters, a price or a button or a row in a screenshot. It goes round and carries on past where it started, the way a real one never lands back on its own line.
• Hand Count — a number that arrives by being written again on every pose instead of rolling. The digits are redrawn, not scrolled, so it belongs in a hand-made scene rather than on a dashboard.
• Crumple Toss — crushes one element into a ball of paper and throws it away while the rest of the scene carries on. There is no swap: the card is cut into wedges that each carry their own piece of the content and fold inward, so the wad is the card.

Improvements

• Ink Underline and Ink Arrow are redrawn through a shared brush library. A brush mark is a filled ribbon offset from its spine rather than a stroke, so it can carry pressure — the underline lands heavy and thins into a dry tail, the arrow opens thin and thickens into its head. Both pick up the same grain, and both now expose it: pressure, release and grain are yours to set, and the arrow draws heavier by default. Any mark made through the library shares one physical language — Scribble Circle is drawn with it too — and it arrives transitively, so you never install it yourself.

Everything in this kit runs on a quantized clock. Instead of sampling the timeline every frame, each component samples it once every three — ten poses a second — so nothing glides. A letter is either written or it is not. A stroke has either been dragged this pose or it waits for the next one. Between poses the whole scene holds still, and every object carries a fraction of a pixel of drift, the wobble of something that was picked up and put back down.

The exception is what plays inside it. Drop a video or a whole live composition into a Polaroid and the frame around it keeps ticking in poses while the picture itself runs at full framerate. A photograph that never stopped playing, with nothing pre-rendered.

New components

• Handwrite — text laid down letter by letter, each glyph keeping its own slant and baseline wobble, the newest one settling from a heavier press.
• Ink Underline — a hand-dragged stroke that draws itself across in a few poses, with a per-seed wobble so it never looks geometric.
• Paper Wobble — wrap anything to give it the reshoot jitter. One offset held for a whole pose, then a snap to the next.
• Ink Arrow — a pen drags a wobbly curve from one point to another, then draws the head one stroke at a time.
• Paper Sticker — a taped chip that slaps down over two poses and keeps a fixed hand-placed tilt.
• Polaroid — an instant-photo frame with a handwritten caption. The media is children, so anything plays inside.
• Page Turn — the exiting scene lifts and swings away like a notebook page. The only transition in the catalog where the outgoing scene stays in front of the one it reveals, because that is what a page does.

The clock itself ships underneath as a registry dependency, so adding any of these pulls it in without you asking for it. Every component takes a step prop if you want a tempo other than three frames a pose.

A caption easing into place did not glide — it held still, clicked down a pixel, held still, clicked again. Give every word or character its own stagger and those clicks land on different frames, so a ripple ran through the line while the rule right next to it stayed perfectly smooth.

That contrast is what made it visible, and it is not a Remotion bug. A glyph is rasterized into a cache that can only be placed on a whole device pixel vertically. Once an eased tail slows below roughly half a pixel per frame, nothing moves for several frames — then the accumulated offset crosses a boundary and the glyph jumps a whole pixel at once. Rectangles and borders have no such cache, so they shade their edge pixel instead and glide.

The fix splits the progress driver in two. Position now lands on a short window while opacity, blur, and colour keep the full curve — the part removed is the part the eye never read as movement, only as clicking. Entrances look the same; the ripple is gone.

Fixes

• Travel windows clipped on Soft Blur In, Per Character Rise, Line By Line Slide, Mask Reveal Up, Bottom Up Letters, Top Down Letters, Short Slide Right, Short Slide Down, and Kinetic Center Build.
• Ease-in exits had the mirrored problem, with the creep at the start instead of the end. Per Word Crossfade, Blur Out Up, Mask Reveal Up, and Line By Line Slide now delay the travel rather than clip it.
• Short Slide Down and Kinetic Center Build also reflow their earlier words every time a new one lands. Those pushes are the dominant motion in both components and had the same eased tail, so they are clipped to the same window as the entrance.
• Staggered Fade Up was already clean and is untouched. It is linear, so it never enters the sub-pixel zone — the proof of the rule rather than an exception to it.

The GitHub stars video generator at /stars is no longer accepting new renders. It was a fun experiment and a good stress test of the render pipeline, but keeping a public render queue healthy is a different project from maintaining a component registry, and the registry is where the value is.

Improvements

• /stars now shows a short notice explaining the retirement instead of the generator form.
• The GitHub Stars component is unaffected — install it and render the same animation inside your own Remotion project, where you own the code and the render.

Docs prose had accumulated a decade of one-off overrides — a margin here, a font size there — and headings drifted between pages. That is all gone. Typography now derives from shadcn typeset, so vertical rhythm, headings, links, and tables come from one system instead of from whichever page you happened to land on.

Improvements

• All docs pages render inside a single typeset container. Per-page text overrides were deleted rather than tuned.
• Code blocks moved to rehype-pretty-code with the vesper theme, matching the shadcn-style block — line numbers, filename with language icon, and a copy button.

Lucide icons, re-authored for video. Every icon draws itself in and then performs one action that belongs to it — the bell rings, the heart beats, the trash lid lifts. The geometry is Lucide's, so they sit next to the icons already in your product; the motion is new.

New components

100 icons across navigation, media, status, commerce, files, and communication. Browse them all in the icon gallery, where each one previews on hover and installs with a single command.

remocn got a proper mark, and the landing page finally leads with motion instead of describing it.

Improvements

• New logo, applied across the site, the favicon, and the open-graph image.
• The hero now plays a real video built from remocn components, rather than a static screenshot of one.

A depth punch between scenes, a slow camera drift for anything that needs to breathe, and two components for the specific problem of replacing one word with another without a hard cut.

New components

• Zoom Blur — the outgoing scene scales past the viewer into blur while the incoming one resolves out of it. rise adds a vertical pickup to the move.
• Drift — a continuous, slow parallax on any child. The fix for static shots that feel dead.
• Rolodex Flip — the old value flips away on a 3D hinge as the new one flips in.
• Value Swap — a shorter, flatter swap for numbers and labels that change often.

An unglamorous week aimed entirely at the things that quietly rot — page weight, type safety, and the gap between what the registry says it ships and what it actually ships.

Improvements

• Landing page Remotion players now mount only when scrolled into view, and registry components lazy-load in the preview barrels. Opening the site no longer means downloading every animation on it.
• The hero video went from 18.5 MB to 4.7 MB, with a poster frame and preload=metadata.
• A registry drift guard fails CI when the built artifacts disagree with the sources in registry/, so an installed component can no longer silently lag behind its docs.
• Typechecking is back on in the build, with the real errors it was hiding fixed rather than suppressed.
• CI runs lint, typecheck, tests, and the drift guard on every push.

Fixes

• The render endpoint now trusts the proxy-set client IP, caps queue depth, and restricts avatar URLs to GitHub's host allowlist.
• Stale finished and errored render jobs are evicted from the job registry instead of accumulating.

Agents were reading remocn docs by scraping the rendered site, which is a bad way to learn an API. Now the docs are available as plain text at the addresses agents already look for.

Improvements

• /llms.txt lists every docs page with a short description.
• /llms-full.txt returns the whole documentation as one Markdown document.
• Any docs page can be fetched as raw Markdown by appending .md to its URL.

remocn had backgrounds and text animations but almost nothing for the cut between two scenes. This closes that hole with eleven transitions — eight driven by shaders, three by camera motion. All of them are Remotion transition presentations, so they drop straight into a TransitionSeries.Transition and take their character from the timing function you pass.

New components

Shader dissolves — Dither Dissolve, Grain Dissolve, Perlin Dissolve, Smoke Dissolve, Swirl Dissolve, Warp Dissolve, Wave Wipe, and Ripple Zoom.

Camera moves — Whip Pan, Push Through, and Focus Pull.

Gradient backdrops read as a slide deck. These read as a product. Eighteen GPU shaders wrapped as Remotion components, each driven by the frame rather than by wall-clock time — so they render deterministically and a re-render produces the same file.

New components

Neuro Noise, Mesh Gradient, Grain Gradient, Liquid Metal, Metaballs, God Rays, Smoke Ring, Dot Orbit, Color Panels, Dithering, Perlin Noise, Simplex Noise, Pulsing Border, Spiral, Swirl, Voronoi, Warp, and Water.

Start with the shaders introduction for the determinism rules before dropping one behind a scene.

Demo videos keep needing the same shot — a conversation typing itself out. Rather than ship one rigid chat component, this adds the pieces and lets you assemble the flow.

New components

• Message Bubble and Typing Indicator — the atoms.
• Chat Flow, iMessage Chat Flow, and Telegram Chat Flow — assembled conversations, each with the platform's own look.
• GitHub Sponsors — the sponsors card, as a companion to the stars card.

If you build videos with an AI agent, it now knows the catalog. The remocn skill teaches Claude Code and friends which components exist, what each one is for, and how to compose them — so "make me an intro scene" stops being a guessing game.

New components

• Glass Code Walk — a camera walk across a code block, for showing a diff without narrating it.
• Terminal Cursor Zoom — the terminal, zoomed to wherever the cursor is working.
• Logo Enter — a logo entrance for the end card.

Improvements

• The agent skill ships with install instructions and a component catalog.
• An install-all button on the components page, for anyone who would rather have everything than choose.

Text is most of what a demo video says, so the typography tier got the most attention. Eighteen entrances and swaps, each built on Remotion's interpolate and spring rather than a CSS keyframe library — they seek correctly, and frame 40 looks the same on every render.

New components

Entrances — Soft Blur In, Per Character Rise, Bottom Up Letters, Top Down Letters, Spring Scale In, Micro Scale Fade, Mask Reveal Up, Line By Line Slide, Kinetic Center Build, and Focus Blur Resolve.

Exits and swaps — Blur Out Up, Scale Down Fade, Fade Through, Per Word Crossfade, Shared Axis Y, Shared Axis Z, Short Slide Down, and Short Slide Right.

Numbers got their own treatment a few days earlier — Number Wheel and Rolling Number — along with Backdrop, the wrapper that gives any component a surface to sit on.

Two shots that show up in almost every launch video — someone prompting an AI, and a follower count going up.

New components

• AI interfaces, typing themselves out — Claude Code, Claude Chat, ChatGPT, OpenCode, and v0.
• X Follow Card and X Followers Overview — the follow button and the count that climbs.
• Confetti — for the moment the number lands.

Every product demo eventually has to show the product — a dialog opening, a command menu filtering, a form being filled. Doing that with real shadcn components inside Remotion does not work, because they animate against wall-clock time and a video has no clock, only a frame number.

So remocn/ui is a parallel set of primitives with the same shapes and a timeline-driven API. You describe the steps; the component renders whichever one the current frame belongs to.

New components

Around forty primitives, including Button, Input, Dialog, Drawer, Sheet, Popover, Tooltip, Select, Combobox, Command Menu, Context Menu, Dropdown Menu, Accordion, Tabs, Stepper, Toast, Slider, Progress, Skeleton, Spinner, and Cursor — the simulated pointer that drives the rest.

Assembled flows too — Checkout Flow, Signup Flow, and Settings Toggle Flow.

Read concepts first — the steps API is the whole idea.

A shadcn registry for Remotion. You already know the workflow — run npx shadcn@latest add, the files land in your project, and they are yours to edit. remocn applies it to video.

Everything is written from scratch against the Remotion API — useCurrentFrame, interpolate, spring — so components seek correctly in the studio and render deterministically. Remotion itself is a prerequisite, not something remocn installs for you.

New components

The first catalog — text effects like Typewriter, Matrix Decode, RGB Glitch Text, Shimmer Sweep, Tracking In, Staggered Fade Up, Slot Machine Roll, Inline Highlight, Marker Highlight, Infinite Marquee, and Perspective Marquee.

Interface blocks — Terminal Simulator, Glass Code Block, Animated Bar Chart, and Animated Line Chart.

And the first compositions — Ecosystem Constellation, Infinite Bento Pan, and Live Code Compilation — full scenes assembled from the primitives above.