Changelog

36 ready-made looks for the gradient shaders, each one its own registry item. Install shader-mesh-gradient-dusk or shader-warp-silk and drop it in: the palette and parameters live in the installed file, the base shader comes along as a dependency, and props you pass still override the preset. Every preset has its own docs page, nested under its base shader in the sidebar, and each base shader page shows a gallery of its presets.

New components

• Nine presets each for Mesh Gradient, Grain Gradient, Warp and Swirl, from soft pastel washes like lavender and blush to loud ones like acid and hypno.
• On a preset, speed scales the preset's own pace instead of replacing it, so speed={2} always means twice as fast.

remocn now ships as a plugin for Claude Code and Codex. Type /remocn:video and a one-line brief: the agent reads your repo for content, picks an archetype and plans a storyboard with a frame budget for every beat, then waits for your go-ahead. After that it installs the components, writes the video, renders stills to check the frames, and offers to open the project in Remocn Studio to tweak and export. Plugin has the install commands and everything inside.

New

• /remocn:video, /remocn:changelog, /remocn:add and /remocn:studio: the video workflow, a release video from your git history, one component at a time, and the Remocn Studio hand-off.
• Two agents for Claude Code: video-director plans the storyboard, scene-reviewer looks at rendered stills and reports clipped text, empty frames and low contrast.
• A remote MCP server at https://remocn.dev/mcp for component search, component pages, video plans and live previews, including in claude.ai and ChatGPT as a custom connector.

Improvements

• The agent skill moved into the plugin, at plugins/remocn/skills/remocn. npx skills add Remocn/remocn still installs it, now next to the plugin's workflow skills.
• The skill's description now leaves Remotion API questions to Remotion's own skills, so the two work side by side.

Fixes

• remocn-ui now installs @types/culori, so a fresh project typechecks after the first UI primitive.

A new Captions tab with thirty-one subtitle styles that follow a real voiceover. Each one reads a timed transcript in the Caption shape from @remotion/captions, splits it into short pages, and animates every word the moment it is spoken. Whisper, the OpenAI API, ElevenLabs or an existing .srt file all produce that transcript, and Get a transcript has a recipe for each. Every style renders only its text block, so you place it yourself, and Positioning has the safe zones for landscape and vertical video.

New components

• Karaoke — each word fills with colour left to right exactly as it is spoken, with the whole phrase readable before the voice reaches it.
• Highlight Box — a solid box travels behind the word being spoken, sliding from word to word as the voice moves on.
• Active Pop — the spoken word turns to the accent colour and springs up in scale, then settles back.
• Underline — a bar slides under the word being spoken while the text itself stays untouched.
• Dim Progress — the whole phrase sits dimmed and each word brightens as it is spoken, with no motion at all.
• Weight — the spoken word swells from a light weight to a heavy one without shifting the line.
• Outline — heavy-stroked captions that stay readable over any footage, with the spoken word switching to a contrast colour.
• Word Pop — one large word at a time, each popping in on a spring.
• Bounce In — each word springs into place with a little overshoot and the phrase builds word by word.
• Blur In — each word resolves out of a soft blur, for captions that arrive quietly.
• Rise — each word slides up out of a mask at its baseline, with no bounce and no scale.
• Typewriter — each word types out at the pace it is spoken, with a caret that blinks through pauses.
• Scramble — each word arrives as random glyphs and decodes left to right into the real letters.
• Slot — one short line at a time, each new phrase rolling up as the previous one rolls out.
• Stack — kinetic captions stacked a couple of words per line, with each page's keyword set large on its own line.
• Subtitle — classic broadcast subtitles on a translucent plate, with no word-level animation.
• Marker — the words that matter get a highlighter swipe the moment they are spoken.
• Emoji — an emoji pops up above a chosen word when it is spoken and stays until the phrase leaves.
• Speaker — dialogue captions where every phrase takes its speaker's colour.
• Prosody — word size follows the delivery, so drawn-out words land large and rushed words stay small.
• Timeline — the whole transcript slides under a fixed playhead on a time strip, so every pause shows up as space.
• Teleprompter — the transcript scrolls through a short window with the current line centred.
• Split Flap — every letter clatters through a few characters on its own flap tile before landing, like a departure board.
• Label Maker — each phrase is punched letter by letter into a strip of embossing tape.
• Drop — each word falls into place and bounces, and the phrase drops out of frame when the speaker pauses.
• Stamp — the words that matter slam down as a rubber stamp.
• Handwrite — each word is inked in by hand at the pace it is spoken.
• Redact — the phrase starts blacked out and each bar pulls away as its word is spoken.
• Knockout — a solid plate with the words cut clean through it, so the footage shows through the letters.
• Slice — each word arrives cut in two, the halves sliding in from opposite sides and locking together.
• Cube — each new phrase turns into view as the next face of a 3D cube.

A new Motion Graphics category: flat geometry built the way motion designers build shape layers. Three openers borrow from Bauhaus, De Stijl and Truchet tiles, and three small accents fire on a click, a landing or a beat, as often as a video needs them. Alongside them come three pieces that show a product at work: the keys behind a shortcut, a code change, and an AI agent answering.

New components

• Bauhaus Build — flat circles, arcs, squares and bars tumble corner over corner on a hidden grid into a frieze, then rebuild around an open band for the title.
• Mondrian Split — black lines cut the frame into a seeded De Stijl grid, primaries wipe into the cells, the grid reflows like rubber, and one cell pushes its own lines out to become the next scene.
• Truchet Flip — quarter-circle tiles snap a quarter turn as a wave crosses the grid, rerouting the lines until they settle into rings, a calm field or a circle.
• Trim Burst — short strokes shoot out of a point like Trim Paths, each start chasing its end until the stroke zips shut in flight.
• Speed Lines — streaks trail a flying element at its real speed and die as it lands with a squash and a small bounce, or radial lines snap onto an impact point.
• Squiggle — a line draws itself along a course as a wave that swims forward and calms, in wave, zigzag, loop or coil shapes.
• Keystroke — physical keycaps press a shortcut in real order, the modifiers held while the letter taps, on the same frame as the UI it triggers.
• Code Morph — Magic Move for code: surviving tokens glide to their new line and column while removed code dissolves and new code fades in.
• Agent Run — a brand-neutral AI agent run where tool calls resolve against a real-seconds timer and the markdown answer streams in bursts.

Five typography pieces built the way a motion designer builds type in After Effects. Two work on the real glyph outlines of any font file: a trim path around every contour, and a font editor's anchors and handles pulling the curves into shape. Three work on live text: striped type, text riding a path, and a repeater.

New components

• Outline Trace — every contour draws itself as a stroke, letter by letter, then the fill wipes up inside each letter and the stroke fades into it. Overlapping contours in variable-font instances stay hidden.
• Glyph Anatomy — metric guides draw across, anchors pop along each contour, and Bézier handles pull straight segments into curves before the glyphs fill and the scaffolding fades.
• Stripe Type — the word is cut into IBM-style bands that slide in from alternating sides and lock, stay striped or close into solid type, and pass on through on the exit.
• Path Ride — a line draws itself along any SVG path with the text riding behind its head, then the curve pulls taut and the text settles on a straight, centered baseline.
• Type Repeater — copies of a word unfold into a tunnel, a spiral or a fan behind it, breathe, and fold back into the word.

Five typography pieces pulled from a code-built motion showreel: heavy words on flat color fields that snap, echo, repeat, spin and land. Each one isolates a single trick and works with any text.

New components

• Selection Snap — a thin word snaps into a design-tool selection while its weight runs from Thin to Black on a variable font, then handles pop in and a size badge counts up.
• Echo Stack — the word focuses in while outline copies unfold above and below it and keep drifting, looping without a seam.
• Type Wall — rows of one word fill the frame in heavy, narrow and outline faces, running in alternating directions at seeded speeds around an accent band.
• Ring Text — a phrase runs around a tilted 3D band that spins, readable on the near side and mirrored on the far side, with the band closing to fit any text.
• Period Drop — the word rises out of its line, then a colored dot falls, bounces twice with squash and stretch, and settles as the period.

Start with a complete, editable Remotion video. Remocn Templates bring together scenes, transitions, and motion so you can customize the content and make the result your own.

Templates

• Release Teaser — a focused product release reveal.
• Brand Guidelines — a brand presentation with typography, colors, and imagery.
• Workflow Console — a command-driven demo with execution logs and performance charts.
• Product Showcase — a product story with a button-to-frame transition and interface scenes.
• Order Flow — a trading feature demo with editable content and styling.

Improvements

• Workflow Console now has its own registry ID, import path, and Studio composition name. The former X Ads MCP identifier is retired.
• Product Showcase keeps the action button close to its headline. Clicking moves the same surface to the center and morphs it continuously into the next scene's frame.

Fixes

• Workflow Console's chart bars grow from a fixed baseline using transforms instead of animated layout heights; labels retain their proportions throughout the zoom.
• Workflow Console's recommendation camera uses transform-only motion and a continuous pan with eased zoom, removing layout stepping and the abrupt zoom-start velocity change.
• Workflow Console's execution log now wipes away completely before the rollout response, instead of stopping at a partially clipped panel.
• Command carets align vertically with their text. A dedicated inner viewport clips and scrolls long commands without letting them cross the border.
• Introducing Product and Studio Launch have been removed from the installable catalog. Historical changelog entries remain available without broken live previews.

New components

Brand Guidelines is a complete 17.9-second identity film for the fictional Form Study studio: an original architectural mark, sliding color panels, typed specimens, rapid style changes, a layered object collage, and a three-word closing reveal.

All brand copy, colors, photographs, and the logo are replaceable. New still-life assets and local font files keep the default install self-contained. Five named scenes, a Studio schema, and a reduced-motion variant make the template editable and reusable. No source-brand assets or soundtrack are included.

Improvements

• Order Flow — graphite and amber styling, fictional market data, original stepped mark, and new copy.
• Workflow Console — release automation, environment diagrams, new terminal commands and pipeline data, navy and ice-blue styling.
• Product Showcase — cream and forest-green styling, four original editorial photographs, unbranded product demos, and geometric illustrations.

All three retain their animation timing, editable layers, existing registry IDs, and legacy exports. New preferred exports are OrderFlow, WorkflowConsole, and ProductShowcase. No reference soundtrack is included.

New components

• Launch Anything — a complete 26.7-second launch film with chrome typography, a sunlit laptop showcase, floating brand marks, and an orbital finale. Includes nine scenes, seven editable product demos, four bundled photographic plates, and controls for copy, colors, logos, media, and audio.

New components

Release Teaser is a sixteen-second cinematic announcement for the fictional Orvio 2. Five editable statements build to a release lockup over an original dimensional open-ring mark with moving edge light.

The template includes configurable branding, copy, colors, custom logos, deterministic geometry and camera movement, optional audio, and a reduced-motion variant. All visual layers are generated from code; no source movie or inherited brand assets are included.

New components

• Workflow Console — an independent 46.8-second terminal-led release automation film with typed commands, environment diagrams, pipeline metrics, and an original node mark. Includes 18 editable scenes, bundled typography, optional audio, and controls for copy, environments, chart data, and terminal rows. The existing registry ID and export remain compatible.

Fixes

• Typed Split Wipe now reveals Unicode code points without briefly splitting characters such as 𝕏 into invalid halves.

New components

Inline Word Roll cycles through words beside a fixed prefix. Each replacement rolls up from below while the line smoothly recenters around its new width. Configure the words, prefix, suffix, interval and acceleration; the final word stays visible. Text measurement uses composition coordinates so scaled website previews retain the correct spacing and clipping.

New components

Light Tunnel projects the original @remocn OpenShaders hero field into a tunnel with straight forward travel. The original colors, silk folds and halftone remain intact. The folds rotate around a fixed central vanishing point, making the circular motion visible throughout the tunnel. Three repetitions of the hero ribbons fill the tunnel with more spiral lines. Controls adjust flight speed, spiral motion, spiral count, depth and exposure. The hero's material phase stays fixed so its color cycle does not dim the ribbons during motion. Light folds stream inward toward the center on top of the circular motion, with a fast inward flow inspired by the reference clip's 1–3 second tunnel sequence.

The center blends into a soft blur, removing the outlined dark circle at the vanishing point while keeping the outer ribbons sharp.

New components

Shader Seam reveals the original @remocn OpenShaders material, then dissolves it in place to uncover the next scene. The scene exchange happens under the fully opaque shader. Its dark areas fade first and luminous folds remain briefly, with no directional travel or cropped edges. Adjust dissolve softness, organic detail and shader time, or supply another compatible local OpenShaders export.

New components

Shader Spiral Pass accelerates straight into a luminous spiral and reveals the next scene through its soft center. It reuses the Light Tunnel shader with its fixed color phase, rotating ribbons and fast inward flow. Controls adjust camera push, exit softness and shader motion. The incoming scene stays clipped inside a narrow, softly edged exit until the final approach, keeping its content from showing through the spiral walls.

New components

Shader Text Reveal reveals words through the original @remocn OpenShaders hero field and halftone texture, then settles into clean white type. A dark diagonal wave clears each word before the next one appears. The shader controls the letters' surface and subtle edge refraction, with frame-driven playback and automatic text fitting.

New

Fomo Limit Orders recreates a complete 18-second trading-product introduction as editable React and SVG source. It includes six scenes, camera movements, a slider-to-caret morph, price entry, a ball following the rounded phone border, and an order confirmation.

Customize the copy, brand, colors, and soundtrack. The template includes local font files and renders without the original reference video.

Improvements

Introducing Product is now a complete 32-second launch video about remocn. Install it to get the same editable scenes that produce the video, including kinetic type, real component previews, a source-editing demonstration, and the final brand lockup.

Change the copy, colors, logo, sound, or any scene in your own project. The original score is generated from included source, and the default composition renders without external assets.

This template was retired from the catalog on September 11, 2026.

New components

Kinetic Morph Text turns editable phrases into a sequence of individual letter flights, rotations, and soft glyph changes. Shared letters move to their new positions, with contour trails that clear as each phrase settles. Controls cover the copy, motion, colors, timing, and looping.

New components

Radial Burst is an abstract opening for product introductions. A circle blooms into sculptural ribbons, twists through a tilted plane, and folds into a ring that sweeps outward with contour echoes. Customize the intensity, ribbon curvature, echoes, segment count, palette, and timing, or turn intensity to zero for a classic geometric burst.

New components

Search Reveal opens with overlapping construction circles, stretches a dash into a search field, and types your product name. An optional abstract panel unfolds behind it in remocn purple. Customize the copy, typing pace, field size, guides, and palette through the preview controls.

New

Studio Launch is a 35.5-second launch template with remocn branding, editable product interfaces, landscape scenes, and camera transitions. It includes phone and desktop demonstrations, a course editor, gated content, and a night-to-day reveal.

Change the brand, copy, images, and soundtrack, or edit any scene in code.

This template was retired from the catalog on September 11, 2026.

New components

• Select Menu — a vertical option list where exactly one row is highlighted. A sliding highlight bar and 3px left accent glide between rows as the selection changes, and the row under the indicator can be "clicked" via selectProgress — a press dip followed by a settling check mark, mirroring select's press→selected flow. The whole thing is driven entirely from the Remotion timeline. Fully controlled (selectedIndex/state snap, useSelectMenuTransition slides with an optional clickAt), with soft accent and solid primary variants.

Templates are complete Remotion videos that can be installed and used as-is. They now have a dedicated registry namespace and documentation tab.

This template was retired from the catalog on September 11, 2026.

New components

• Introducing Product is the first installable template: a complete 53-second product story with kinetic positioning, editable product UI, benefit scenes, and an orbital brand outro. Its Remotion Studio schema exposes content, colors, assets, every scene duration, layout values, and easing presets.

Improvements

• Rush Type accepts color and backgroundColor props, remapping the accumulated shutter intensities onto any palette instead of the fixed white-on-black frame.

New components

• Word Stream builds narration-paced phrases with blurred previews of the next word.
• Word Push drives new words into a phrase while easing the line toward its new center.
• Sheen Slide In settles a title from the right while a restrained highlight crosses the glyphs.
• Squeeze In reveals a word before compressing its tracking in one coordinated move.
• Fog Rise stands text upright through perspective, blur, and a center-out reveal.
• Caret Swap consumes one phrase with a caret block and types the replacement.
• Zoom Words tracks a growing line at close range while the shot pulls into focus.
• Centered Word Build snaps words into view from below while the centered phrase pushes closer on every beat, then wipes away from left to right.
• Inline Pill Takeover expands an inline CTA to push a sentence apart, blur it away, and take over the frame through a fast camera punch-in.
• Typed Split Wipe types a centered introduction, holds it, then erases fixed segments in opposing directions without reflow.
• Shadow Sweep Text moves a line up and left while two dense dark shadows uncover it and then sweep it away.
• Outline Fill Track Text carries a rising lead word into an outlined value that fills from left to right on the same moving track.
• Gradient Scale Cut Text reveals an oversized gradient title before snapping to a compact blurred layer that settles into focus.

Product demos can now stage and direct one continuous surface with a single component. Stage gives screenshots, recordings, long pages, and live React scenes a perspective studio treatment, then moves an integrated operator camera across them with normalized timeline targets.

New component

• Stage — places any surface on a stronger perspective plane and directs the camera with normalized x/y targets, per-arrival easing, holds, endpoint clamps, zoom, roll, and deterministic handheld shake. Explicit contentSize lets the camera travel from top to bottom of a page much taller than the video frame.

Until now there was one way to get a remocn component into your project — npx shadcn add, then wire it into a composition by hand. That is still the canonical path, but if a Remotion Studio (4.0.502+) is running locally, the site can now talk to it directly through the Remotion Studio Protocol.

Improvements

• Component pages grew an Add to Studio button and a drag handle next to the Preview/Code tabs. The button finds your running Studio and installs the component into the active composition; the handle lets you drag the element onto the timeline and choose its place yourself. Both deliver the same thing the CLI does — editable source code in your project, not a black box.
• The icons gallery works the same way: every tile is draggable, and a hover button installs the icon in one click.
• Elements arrive editable, not frozen. Almost every element ships with the same knobs its docs page has — text, colors, timings, speed — declared through Remotion's own InteractivitySchema and rendered as native controls in the Studio sidebar, plus the standard timeline and transform controls on top. Under the hood the whole catalog now authors its controls in that schema format, so the docs customizer and the Studio panel are generated from one source.
• Coverage is honest rather than total. Primitives, shaders, effects, filters and all icons ship as Studio Elements; compositions and components that build on other remocn components keep the CLI as their only path, because flattening them into a single file would produce source nobody wants to remix. Where the button is absent, npx shadcn add is the answer.

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.