sh4dcnv2 · atlas
← libraries

@remocn

remocn is a shadcn registry of 64+ production-ready Remotion video components for building product demos, changelogs, and launch videos in React. Categories: Text Animations (blur reveal, typewriter, shimmer sweep, slot machine, matrix decode, RGB glitch, kinetic type mask, infinite marquee), Backgrounds (mesh gradient, dynamic grid, spring pop-in), Transitions (chromatic aberration wipe, frosted glass wipe, directional wipe, grid pixelate, spatial push, zoom-through), UI Blocks (terminal simulator, browser flow, toast notification, animated charts, device mockup zoom, morphing modal), and full Compositions (product launch trailer, changelog bite, pricing tier focus). Built on Remotion 4.0, React 19, Tailwind v4, Next.js. Fully free, MIT license. Use for: creating animated product demo videos, changelogs, or documentation clips programmatically in React without a video editor.

250 components pro available react shadcn-cli MIT

Install this registry

shadcn (npm) npx shadcn@latest add https://www.remocn.dev/r/registry.json
pnpm pnpm dlx shadcn@latest add https://www.remocn.dev/r/registry.json
bun bunx shadcn@latest add https://www.remocn.dev/r/registry.json
fetch registry curl -s https://www.remocn.dev/r/registry.json

Components

250 total
Soft Blur In component

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

npx shadcn@latest add https://www.remocn.dev/r/soft-blur-in.json
Per Character Rise component

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

npx shadcn@latest add https://www.remocn.dev/r/per-character-rise.json
Bottom-Up Letters component

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

npx shadcn@latest add https://www.remocn.dev/r/bottom-up-letters.json
Top-Down Letters component

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

npx shadcn@latest add https://www.remocn.dev/r/top-down-letters.json
Spring Scale In component

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

npx shadcn@latest add https://www.remocn.dev/r/spring-scale-in.json
Micro Scale Fade component

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

npx shadcn@latest add https://www.remocn.dev/r/micro-scale-fade.json
Scale Down Fade component

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

npx shadcn@latest add https://www.remocn.dev/r/scale-down-fade.json
Blur Out Up component

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

npx shadcn@latest add https://www.remocn.dev/r/blur-out-up.json
Focus Blur Resolve component

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

npx shadcn@latest add https://www.remocn.dev/r/focus-blur-resolve.json
Lens Zoom component

A hard cut disguised as a lens punch-in: barrel distortion, zoom blur, chromatic split and camera shake around the splice.

npx shadcn@latest add https://www.remocn.dev/r/lens-zoom.json
Line-by-Line Slide component

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

npx shadcn@latest add https://www.remocn.dev/r/line-by-line-slide.json
Per-Word Crossfade component

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

npx shadcn@latest add https://www.remocn.dev/r/per-word-crossfade.json
Word Stream component

Voiceover-paced phrases that build word by word — the next word looms as a blurred ghost before it resolves, then the phrase cuts away.

npx shadcn@latest add https://www.remocn.dev/r/word-stream.json
Word Push component

A phrase builds from its first word centered: each next word drives in from the right and pushes the line left, easing into the new center.

npx shadcn@latest add https://www.remocn.dev/r/word-push.json
Sheen Slide In component

A title glides in from the right with an exponential settle and a slow final creep to center, while a gradient sheen sweeps once through the glyphs.

npx shadcn@latest add https://www.remocn.dev/r/sheen-slide-in.json
Squeeze In component

Characters appear one by one on a tight stagger; when the last one lands, every letter gap compresses as one and the word squeezes together.

npx shadcn@latest add https://www.remocn.dev/r/squeeze-in.json
Fog Rise component

Display text resolves out of fog: characters sharpen from heavy blur center-out with vertical streaks dissolving above them, as if rising along the z-axis.

npx shadcn@latest add https://www.remocn.dev/r/fog-rise.json
Caret Swap component

A gradient caret swells into a block that consumes the first phrase right-to-left, collapses back and types the second phrase out with a blinking caret.

npx shadcn@latest add https://www.remocn.dev/r/caret-swap.json
Zoom Words component

A close-up word reveal: huge words fade into a long line while the camera rides the write head, the line streaming off-frame as the shot eases into focus.

npx shadcn@latest add https://www.remocn.dev/r/zoom-words.json
Centered Word Build component

Words appear sharply from below while the centered phrase pushes cumulatively closer on every beat, then clears through a soft left-to-right opacity wipe.

npx shadcn@latest add https://www.remocn.dev/r/centered-word-build.json
Inline Pill Takeover component

A clipped pill expands inside a sentence, physically pushes the surrounding words apart, removes them through blur and takes over the frame with a fast camera …

npx shadcn@latest add https://www.remocn.dev/r/inline-pill-takeover.json
Typed Split Wipe component

A centered cursorless type build holds, then exits through opposing fixed-layout glyph wipes that leave the anchor visible longest.

npx shadcn@latest add https://www.remocn.dev/r/typed-split-wipe.json
Shadow Sweep Text component

A line rises up and left while one dense dark shadow uncovers it and a second shadow sweeps back across it for the exit.

npx shadcn@latest add https://www.remocn.dev/r/shadow-sweep-text.json
Outline Fill Track Text component

A rising lead word gives way to an outlined value that fills from left to right while both travel on one continuous track.

npx shadcn@latest add https://www.remocn.dev/r/outline-fill-track-text.json
Gradient Scale Cut Text component

An oversized gradient reveal snaps to a separate compact blurred line that settles left while the reveal continues.

npx shadcn@latest add https://www.remocn.dev/r/gradient-scale-cut-text.json
Rush Type component

A resting white word blasts through vertical scale motion, separating into energy-conserving RGB shutter trails before the next word resolves.

npx shadcn@latest add https://www.remocn.dev/r/rush-type.json
Extrude Pop component

A flat word pops up out of the plane on a solid colored 3D body, no camera involved.

npx shadcn@latest add https://www.remocn.dev/r/extrude-pop.json
Fade Through component

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

npx shadcn@latest add https://www.remocn.dev/r/fade-through.json
Shared Axis Y component

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

npx shadcn@latest add https://www.remocn.dev/r/shared-axis-y.json
Shared Axis Z component

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

npx shadcn@latest add https://www.remocn.dev/r/shared-axis-z.json
Short Slide Right component

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

npx shadcn@latest add https://www.remocn.dev/r/short-slide-right.json
Kinetic Morph Text component

Letters lift, rotate, and softly reshape into editable phrases with sampled outline trails.

npx shadcn@latest add https://www.remocn.dev/r/kinetic-morph-text.json
Kinetic Warp component

A coarse mesh warp bends a whole word in staccato beats, one axis per keyframe.

npx shadcn@latest add https://www.remocn.dev/r/kinetic-warp.json
Kinetic Center Build component

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

npx shadcn@latest add https://www.remocn.dev/r/kinetic-center-build.json
Short Slide Down component

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

npx shadcn@latest add https://www.remocn.dev/r/short-slide-down.json
Typewriter component

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

npx shadcn@latest add https://www.remocn.dev/r/typewriter.json
Inline Highlight component

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

npx shadcn@latest add https://www.remocn.dev/r/inline-highlight.json
Stretch In component

Letters fly in from off-canvas and smear horizontally on the way — a vertex-lag deformation, not a scale.

npx shadcn@latest add https://www.remocn.dev/r/stretch-in.json
Strikethrough Replace component

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

npx shadcn@latest add https://www.remocn.dev/r/strikethrough-replace.json
Staggered Fade Up component

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

npx shadcn@latest add https://www.remocn.dev/r/staggered-fade-up.json
Mask Reveal Up component

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

npx shadcn@latest add https://www.remocn.dev/r/mask-reveal-up.json
Tracking In component

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

npx shadcn@latest add https://www.remocn.dev/r/tracking-in.json
Shimmer Sweep component

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

npx shadcn@latest add https://www.remocn.dev/r/shimmer-sweep.json
Marker Highlight component

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

npx shadcn@latest add https://www.remocn.dev/r/marker-highlight.json
Slot Machine Roll component

Vertical reel scrolls characters from one value to another.

npx shadcn@latest add https://www.remocn.dev/r/slot-machine-roll.json
Matrix Decode component

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

npx shadcn@latest add https://www.remocn.dev/r/matrix-decode.json
RGB Glitch Text component

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

npx shadcn@latest add https://www.remocn.dev/r/rgb-glitch-text.json
Infinite Marquee component

Seamlessly looping horizontal text strip with optional stroke style.

npx shadcn@latest add https://www.remocn.dev/r/infinite-marquee.json
Shader Mesh Gradient component

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

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient.json
Shader Mesh Gradient Dusk component

Violet dusk with coral and peach light drifting through deep indigo.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-dusk.json
Shader Mesh Gradient Lagoon component

Bright aqua and teal shallows with a deep-blue undertow.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-lagoon.json
Shader Mesh Gradient Peach component

Warm peach and cream glow with a whisper of film grain.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-peach.json
Shader Mesh Gradient Aurora component

Cyan and violet ribbons swirling out of a near-black sky.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-aurora.json
Shader Mesh Gradient Lavender component

Soft lilac and pink haze with grain-softened edges.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-lavender.json
Shader Mesh Gradient Ember component

Molten orange and amber pooling in dark oxblood.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-ember.json
Shader Mesh Gradient Mint component

Airy mint and sky-blue pastel wash around a deeper green core.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-mint.json
Shader Mesh Gradient Synthwave component

Night-purple field lit by a warm coral sunset glow.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-synthwave.json
Shader Mesh Gradient Ink component

Monochrome ink folds in charcoal and silver with grain.

npx shadcn@latest add https://www.remocn.dev/r/shader-mesh-gradient-ink.json
Shader Grain Gradient component

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

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient.json
Shader Grain Gradient Sunrise component

Grainy wave of coral and gold rising over a plum night.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-sunrise.json
Shader Grain Gradient Nebula component

Magenta and cyan glow blooming from the corners of deep space.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-nebula.json
Shader Grain Gradient Orb component

Large grainy sphere in periwinkle, violet and pink.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-orb.json
Shader Grain Gradient Horizon component

Peach horizon band rolling between navy and pale sky.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-horizon.json
Shader Grain Gradient Blush component

Pastel pink and apricot blob morphing on warm off-white.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-blush.json
Shader Grain Gradient Tide component

Teal ripple ring pulsing out of a dark sea-green core.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-tide.json
Shader Grain Gradient Arcade component

Retro grainy dots in orange, yellow and green on black.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-arcade.json
Shader Grain Gradient Dune component

Sandy grain wave in tan, caramel and rust.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-dune.json
Shader Grain Gradient Ultraviolet component

Electric magenta and blue blob morphing on ultraviolet black.

npx shadcn@latest add https://www.remocn.dev/r/shader-grain-gradient-ultraviolet.json
Shader Warp component

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

npx shadcn@latest add https://www.remocn.dev/r/shader-warp.json
Shader Warp Silk component

Violet and pink liquid silk folding in slow waves.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-silk.json
Shader Warp Sunset component

Marbled coral, peach and wine flowing like warm liquid.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-sunset.json
Shader Warp Ocean component

Glossy aqua currents traced with dark ink edges.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-ocean.json
Shader Warp Marble component

Cream and charcoal marble veins swirling together.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-marble.json
Shader Warp Acid component

Loud lime and cyan fluid swirling over black.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-acid.json
Shader Warp Cream component

Soft peach-to-coral cream gradient with a gentle drift.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-cream.json
Shader Warp Deep Sea component

Diagonal teal bands rippling through midnight blue.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-deep-sea.json
Shader Warp Rose Gold component

Satin rose-gold folds with a soft sheen.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-rose-gold.json
Shader Warp Storm component

Deep violet and lavender storm of marbled fluid.

npx shadcn@latest add https://www.remocn.dev/r/shader-warp-storm.json
Shader Swirl component

Concentric bands swirling around a center point.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl.json
Shader Swirl Candy component

Pastel pink, lilac and sky-blue spiral, soft and sweet.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-candy.json
Shader Swirl Sunburst component

Retro cream and orange bands sweeping in from above.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-sunburst.json
Shader Swirl Hypno component

High-contrast black and white hypnotic spiral.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-hypno.json
Shader Swirl Neon component

Neon teal, purple and pink vortex around a dark core.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-neon.json
Shader Swirl Tide component

Silky blue bands twisting into a deep navy whirlpool.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-tide.json
Shader Swirl Citrus component

Juicy yellow, pink and green bands spiralling on cream.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-citrus.json
Shader Swirl Ember component

Gold and orange fire bands spinning around a dark core.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-ember.json
Shader Swirl Lilac component

Dreamy lilac and baby-blue swirl around a dark eye.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-lilac.json
Shader Swirl Retro component

Seventies spiral in orange, sand and teal.

npx shadcn@latest add https://www.remocn.dev/r/shader-swirl-retro.json
Shader Water component

Caustic water-surface ripples with subtle refraction.

npx shadcn@latest add https://www.remocn.dev/r/shader-water.json
Shader Spiral component

Rotating spiral arms radiating from the center.

npx shadcn@latest add https://www.remocn.dev/r/shader-spiral.json
Shader Liquid Metal component

Molten metallic surface with flowing specular highlights.

npx shadcn@latest add https://www.remocn.dev/r/shader-liquid-metal.json
Shader Color Panels component

Overlapping translucent color panels sliding past each other.

npx shadcn@latest add https://www.remocn.dev/r/shader-color-panels.json
Shader Neuro Noise component

Organic neural-web noise field that slowly morphs.

npx shadcn@latest add https://www.remocn.dev/r/shader-neuro-noise.json
Shader Perlin Noise component

Classic Perlin noise clouds drifting across the frame.

npx shadcn@latest add https://www.remocn.dev/r/shader-perlin-noise.json
Shader Simplex Noise component

Simplex noise flow field, smoother than Perlin.

npx shadcn@latest add https://www.remocn.dev/r/shader-simplex-noise.json
Shader Voronoi component

Animated Voronoi cells shifting and re-tessellating.

npx shadcn@latest add https://www.remocn.dev/r/shader-voronoi.json
Shader Dot Orbit component

Dots orbiting on concentric paths across the frame.

npx shadcn@latest add https://www.remocn.dev/r/shader-dot-orbit.json
Shader Dithering component

Ordered-dither shading over an animated gradient field.

npx shadcn@latest add https://www.remocn.dev/r/shader-dithering.json
Shader God Rays component

Volumetric light rays radiating from an off-screen source.

npx shadcn@latest add https://www.remocn.dev/r/shader-god-rays.json
Shader Smoke Ring component

Soft smoke ring curling and dissipating in place.

npx shadcn@latest add https://www.remocn.dev/r/shader-smoke-ring.json
Shader Metaballs component

Organic blobs merging and splitting like lava.

npx shadcn@latest add https://www.remocn.dev/r/shader-metaballs.json
Shader Pulsing Border component

Glowing border frame that pulses around the edges.

npx shadcn@latest add https://www.remocn.dev/r/shader-pulsing-border.json
Simulated Cursor component

Animated mouse cursor moving between waypoints with click ripple feedback.

npx shadcn@latest add https://www.remocn.dev/r/simulated-cursor.json
Swirl Dissolve component

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

npx shadcn@latest add https://www.remocn.dev/r/swirl-dissolve.json
Dither Dissolve component

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

npx shadcn@latest add https://www.remocn.dev/r/dither-dissolve.json
Perlin Dissolve component

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

npx shadcn@latest add https://www.remocn.dev/r/perlin-dissolve.json
Smoke Dissolve component

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

npx shadcn@latest add https://www.remocn.dev/r/smoke-dissolve.json
Wave Wipe component

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

npx shadcn@latest add https://www.remocn.dev/r/wave-wipe.json
Ripple Zoom component

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

npx shadcn@latest add https://www.remocn.dev/r/ripple-zoom.json
Gooey Morph component

Bars fly in Tetris-style, land as a row, and melt into a word through a gooey blur-and-threshold morph.

npx shadcn@latest add https://www.remocn.dev/r/gooey-morph.json
Grain Dissolve component

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

npx shadcn@latest add https://www.remocn.dev/r/grain-dissolve.json
Warp Dissolve component

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

npx shadcn@latest add https://www.remocn.dev/r/warp-dissolve.json
Whip Pan component

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

npx shadcn@latest add https://www.remocn.dev/r/whip-pan.json
Push Through component

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

npx shadcn@latest add https://www.remocn.dev/r/push-through.json
Focus Pull component

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

npx shadcn@latest add https://www.remocn.dev/r/focus-pull.json
Zoom Blur component

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

npx shadcn@latest add https://www.remocn.dev/r/zoom-blur.json
Rolodex Flip component

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

npx shadcn@latest add https://www.remocn.dev/r/rolodex-flip.json
Value Swap component

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

npx shadcn@latest add https://www.remocn.dev/r/value-swap.json
Chat to Preview Layout component

Two-column layout where chat shrinks and preview expands.

npx shadcn@latest add https://www.remocn.dev/r/chat-to-preview-layout.json
Animated Line Chart component

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

npx shadcn@latest add https://www.remocn.dev/r/animated-line-chart.json
Animated Bar Chart component

Bars spring up from the baseline in a staggered cascade.

npx shadcn@latest add https://www.remocn.dev/r/animated-bar-chart.json
Terminal Simulator component

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

npx shadcn@latest add https://www.remocn.dev/r/terminal-simulator.json
Terminal Cursor Zoom component

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

npx shadcn@latest add https://www.remocn.dev/r/terminal-cursor-zoom.json
Glass Code Block component

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

npx shadcn@latest add https://www.remocn.dev/r/glass-code-block.json
Glass Code Walk component

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

npx shadcn@latest add https://www.remocn.dev/r/glass-code-walk.json
Perspective Marquee component

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

npx shadcn@latest add https://www.remocn.dev/r/perspective-marquee.json
Perspective Squeeze component

Two lines of heavy type endlessly trade height while corner-pinned perspective bends the flat stack into receding planes.

npx shadcn@latest add https://www.remocn.dev/r/perspective-squeeze.json
Ecosystem Constellation component

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

npx shadcn@latest add https://www.remocn.dev/r/ecosystem-constellation.json
Live Code Compilation component

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

npx shadcn@latest add https://www.remocn.dev/r/live-code-compilation.json
Infinite Bento Pan component

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

npx shadcn@latest add https://www.remocn.dev/r/infinite-bento-pan.json
GitHub Sponsors component

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

npx shadcn@latest add https://www.remocn.dev/r/github-sponsors.json
GitHub Stars component

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

npx shadcn@latest add https://www.remocn.dev/r/github-stars.json
Number Wheel component

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

npx shadcn@latest add https://www.remocn.dev/r/number-wheel.json
Rolling Number component

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

npx shadcn@latest add https://www.remocn.dev/r/rolling-number.json
X Follow Card component

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

npx shadcn@latest add https://www.remocn.dev/r/x-follow-card.json
X Followers Overview component

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

npx shadcn@latest add https://www.remocn.dev/r/x-followers-overview.json
Claude Chat component

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

npx shadcn@latest add https://www.remocn.dev/r/claude-chat.json
ChatGPT component

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

npx shadcn@latest add https://www.remocn.dev/r/chat-gpt.json
v0 component

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

npx shadcn@latest add https://www.remocn.dev/r/v0.json
Claude Code component

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

npx shadcn@latest add https://www.remocn.dev/r/claude-code.json
OpenCode component

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

npx shadcn@latest add https://www.remocn.dev/r/opencode.json
Chromatic Wave component

A soft wave travels down through the type; where it crosses, the letters ripple and split into RGB fringes.

npx shadcn@latest add https://www.remocn.dev/r/chromatic-wave.json
Radial Burst component

Sculptural ribbons twist into a tilted ring and sweep outward through contour echoes for an expressive product introduction.

npx shadcn@latest add https://www.remocn.dev/r/radial-burst.json
Confetti component

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

npx shadcn@latest add https://www.remocn.dev/r/confetti.json
Backdrop component

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

npx shadcn@latest add https://www.remocn.dev/r/backdrop.json
Drift component

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

npx shadcn@latest add https://www.remocn.dev/r/drift.json
Stage component

Place a screenshot, recording, or long page on a perspective studio plane and direct an integrated camera across it with timeline keyframes.

npx shadcn@latest add https://www.remocn.dev/r/stage.json
Logo Enter component

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

npx shadcn@latest add https://www.remocn.dev/r/logo-enter.json
Handwrite component

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

npx shadcn@latest add https://www.remocn.dev/r/handwrite.json
Ink Underline component

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

npx shadcn@latest add https://www.remocn.dev/r/ink-underline.json
Paper Wobble component

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

npx shadcn@latest add https://www.remocn.dev/r/paper-wobble.json
Ink Arrow component

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

npx shadcn@latest add https://www.remocn.dev/r/ink-arrow.json
Paper Sticker component

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

npx shadcn@latest add https://www.remocn.dev/r/paper-sticker.json
Polaroid component

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

npx shadcn@latest add https://www.remocn.dev/r/polaroid.json
Hand Count component

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

npx shadcn@latest add https://www.remocn.dev/r/hand-count.json
Brush component

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

npx shadcn@latest add https://www.remocn.dev/r/brush.json
Crumple Toss component

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

npx shadcn@latest add https://www.remocn.dev/r/crumple-toss.json
Scribble Circle component

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

npx shadcn@latest add https://www.remocn.dev/r/scribble-circle.json
Check List component

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

npx shadcn@latest add https://www.remocn.dev/r/check-list.json
Page Turn component

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

npx shadcn@latest add https://www.remocn.dev/r/page-turn.json
Stop Motion Clock lib

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

npx shadcn@latest add https://www.remocn.dev/r/stop-motion.json
ASCII Dissolve component

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

npx shadcn@latest add https://www.remocn.dev/r/ascii-dissolve.json
Caret Wipe component

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

npx shadcn@latest add https://www.remocn.dev/r/caret-wipe.json
Icon Scatter component

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

npx shadcn@latest add https://www.remocn.dev/r/icon-scatter.json
Shader Caustics component

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

npx shadcn@latest add https://www.remocn.dev/r/shader-caustics.json
Shader Gem Smoke component

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

npx shadcn@latest add https://www.remocn.dev/r/shader-gem-smoke.json
Shader Strata component

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

npx shadcn@latest add https://www.remocn.dev/r/shader-strata.json
Shader Weave component

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

npx shadcn@latest add https://www.remocn.dev/r/shader-weave.json
Reel component

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

npx shadcn@latest add https://www.remocn.dev/r/reel.json
Scene Motion lib

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

npx shadcn@latest add https://www.remocn.dev/r/scene-motion.json
Slide Swap component

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

npx shadcn@latest add https://www.remocn.dev/r/slide-swap.json
Spring Settle component

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

npx shadcn@latest add https://www.remocn.dev/r/spring-settle.json
Canvas Presentation lib

The html-in-canvas scaffolding the canvas transitions and scene filters share: support detection, a full-screen WebGL2 shader fed either both sides of a cut or…

npx shadcn@latest add https://www.remocn.dev/r/canvas-presentation.json
Ember Burn component

The outgoing frame catches fire where it is brightest, boils in the heat, chars at the rim, and blows away as sparks carrying its own colour.

npx shadcn@latest add https://www.remocn.dev/r/ember-burn.json
Displacement component

The frame breaks into a grid of cells that shear apart into offset, colour-fringed tiles under film grain, then settle back carrying the next scene.

npx shadcn@latest add https://www.remocn.dev/r/displacement.json
Hologram component

Play a scene as a projection: a ghost double shimmers off the image, emission lines structure it, and only what is bright enough carries through the dark volum…

npx shadcn@latest add https://www.remocn.dev/r/hologram.json
Security Cam component

Run a scene through a cheap recorder: macroblocks flatten under a starved bitrate, colour resolution collapses to half the luma, blacks crush and shadows crawl…

npx shadcn@latest add https://www.remocn.dev/r/security-cam.json
TV Power Off component

End a scene the way a tube does: the picture collapses into a glowing horizontal line, the line pinches to a phosphor dot, the dot decays, and the frame is lef…

npx shadcn@latest add https://www.remocn.dev/r/tv-power-off.json
Camera Lens component

Put a scene behind real glass: resolution falls off toward the corners, highlights bloom through the optics, colour fringes at the edges — a screencast that re…

npx shadcn@latest add https://www.remocn.dev/r/camera-lens.json
Underwater Ripple component

Hold a scene under moving water: every pixel is read through a layered refraction field that closes on a whole number of cycles, with colour fringing where the…

npx shadcn@latest add https://www.remocn.dev/r/underwater-ripple.json
Halftone Print component

Print a scene onto paper: each colour separates onto its own rotated screen of dots sized by the ink under them, slightly out of register the way a real press …

npx shadcn@latest add https://www.remocn.dev/r/halftone-print.json
ASCII Render component

Redraw a live scene as ASCII: the frame divides into glyph cells and each one becomes the character matching the brightness of the picture inside it.

npx shadcn@latest add https://www.remocn.dev/r/ascii-render.json
Pixelate Region component

Cover rectangles of a scene with an opaque mosaic while the rest passes through untouched — redact keys, addresses and personal data before a demo goes out.

npx shadcn@latest add https://www.remocn.dev/r/pixelate-region.json
Sustained Glitch component

Broadcast corruption held over a scene in scheduled bursts: slices tear sideways, channels split, and blocks fill with picture pulled from somewhere else — the…

npx shadcn@latest add https://www.remocn.dev/r/sustained-glitch.json
CRT Screen component

Put a scene behind curved glass: the picture bulges out to the corners, an RGB phosphor mask and scanlines ride the curve, bright areas flood the mask, and the…

npx shadcn@latest add https://www.remocn.dev/r/crt-screen.json
VHS Filter component

Hold a scene under analog tape: chroma bleeds sideways off every edge, rows wobble out of line, the bottom of the frame tears on the head switch, and luma nois…

npx shadcn@latest add https://www.remocn.dev/r/vhs-filter.json
Grid Wave component

A wave travels across the frame raising the picture into a grid of solid blocks with lit tops and shaded sides, which set back down carrying the next scene.

npx shadcn@latest add https://www.remocn.dev/r/grid-wave.json
Particle Dissolve component

The frame is ground into drifting grey dust whose specks carry real fragments of the picture, and the next scene coalesces back out of the same dust.

npx shadcn@latest add https://www.remocn.dev/r/particle-dissolve.json
Glitch Cut component

A broadcast-glitch hard cut: the frame tears into displaced slices with channel split and corrupted blocks, and the incoming scene takes over slice by slice at…

npx shadcn@latest add https://www.remocn.dev/r/glitch-cut.json
Search Reveal component

Expanding construction circles snap into a search pill, type editable text, and reveal an abstract graphic panel.

npx shadcn@latest add https://www.remocn.dev/r/search-reveal.json
Cursor Gravity component

A rounded triangular cursor tugs a button out of the screen edge with pulsed elastic resistance.

npx shadcn@latest add https://www.remocn.dev/r/cursor-gravity.json
Type Fossil component

A readable word carries layers of fine contours, revises itself, then compresses into a clean typographic imprint.

npx shadcn@latest add https://www.remocn.dev/r/type-fossil.json
Shader Seam component

Dissolve a stationary OpenShaders material to uncover the next scene.

npx shadcn@latest add https://www.remocn.dev/r/shader-seam.json
Shader Text Reveal component

Reveal words through the original OpenShaders hero shader, then settle into white type.

npx shadcn@latest add https://www.remocn.dev/r/shader-text-reveal.json
Inline Word Roll component

Roll through words beside a fixed prefix with accelerating timing and smoothly centered width.

npx shadcn@latest add https://www.remocn.dev/r/inline-word-roll.json
Light Tunnel component

Fly straight through a tunnel made from the original OpenShaders hero shader.

npx shadcn@latest add https://www.remocn.dev/r/shader-light-tunnel.json
Shader Spiral Pass component

Accelerate into the hero spiral and emerge through its soft center into the next scene.

npx shadcn@latest add https://www.remocn.dev/r/shader-spiral-pass.json
Truchet Flip component

Quarter-circle Truchet tiles snap a quarter turn as a wave crosses the grid, rerouting continuous lines until they settle into concentric loops, a calm field, …

npx shadcn@latest add https://www.remocn.dev/r/truchet-flip.json
Mondrian Split component

Black lines cut the frame into a seeded De Stijl grid, primaries wipe into its cells, the grid reflows like rubber, and one cell pushes its own lines out past …

npx shadcn@latest add https://www.remocn.dev/r/mondrian-split.json
Bauhaus Build component

Flat Bauhaus circles, arcs, squares and bars tumble corner over corner on a hidden grid into an asymmetric frieze, then rebuild into two friezes around an open…

npx shadcn@latest add https://www.remocn.dev/r/bauhaus-build.json
Squiggle component

A flat line draws itself along a straight course as a traveling wave whose crests swim forward and calm down as the head runs out, in wave, zigzag, loop or coi…

npx shadcn@latest add https://www.remocn.dev/r/squiggle.json
Speed Lines component

Parallel streaks trail an element as it flies in at its real speed, the element stretching with that speed and landing with a squash and a small bounce as the …

npx shadcn@latest add https://www.remocn.dev/r/speed-lines.json
Trim Burst component

A ring of short straight strokes shoots out from a point like Trim Paths: each end races ahead on a hard-braking ease-out while its start holds, then chases it…

npx shadcn@latest add https://www.remocn.dev/r/trim-burst.json
Keystroke component

Physical keycaps rise in for each shortcut, press in real order with the modifiers held while the letter taps, spring back with a small capped overshoot, and l…

npx shadcn@latest add https://www.remocn.dev/r/keystroke.json
Code Morph component

A flat code editor that morphs between versions of a file, gliding each surviving token to its new line and column while removed code dissolves and new code fa…

npx shadcn@latest add https://www.remocn.dev/r/code-morph.json
Agent Run component

Animated brand-neutral AI agent run — a Thinking status and short plan, tool calls whose spinners close into checks while a timer counts real seconds, then a m…

npx shadcn@latest add https://www.remocn.dev/r/agent-run.json
Selection Snap component

A thin word in a loose viewfinder snaps into a design-tool selection while it goes from Thin to Black, pops its handles and counts up a size badge.

npx shadcn@latest add https://www.remocn.dev/r/selection-snap.json
Echo Stack component

A word focuses in at the center while outline copies of it unfold above and below and keep drifting, like the one clear line on a spinning drum.

npx shadcn@latest add https://www.remocn.dev/r/echo-stack.json
Type Wall component

Rows of one word fill the frame, run in alternating directions at different speeds in heavy, narrow and outline faces, with an accent band through the middle.

npx shadcn@latest add https://www.remocn.dev/r/type-wall.json
Ring Text component

Text runs around a tilted 3D band that spins, reading on the near side and mirrored on the far side.

npx shadcn@latest add https://www.remocn.dev/r/ring-text.json
Period Drop component

A word rises out of its line, then a colored dot falls from above the frame, bounces with squash and stretch, and settles as the period.

npx shadcn@latest add https://www.remocn.dev/r/period-drop.json
Outline Trace component

Every glyph contour draws itself as a stroke, letter by letter, then the fill wipes up inside each letter and the stroke fades into it.

npx shadcn@latest add https://www.remocn.dev/r/outline-trace.json
Glyph Anatomy component

A word builds as in a font editor, with metric guides, anchors along each contour and Bézier handles that pull straight segments into curves before the glyphs …

npx shadcn@latest add https://www.remocn.dev/r/glyph-anatomy.json
Stripe Type component

A word cut into horizontal bands, as in the IBM logo, slides together from alternating sides and locks, then can pass on through.

npx shadcn@latest add https://www.remocn.dev/r/stripe-type.json
Path Ride component

A line draws itself along a curve with the text riding behind its head, then the curve pulls taut and the text settles on a straight, centered baseline.

npx shadcn@latest add https://www.remocn.dev/r/path-ride.json
Type Repeater component

An After Effects style repeater on a word, where copies unfold into a tunnel, a spiral or a fan behind it, breathe, then fold back into the word.

npx shadcn@latest add https://www.remocn.dev/r/type-repeater.json
Caption Core lib

The timing engine every caption style shares: pages a timed transcript, finds the word being spoken and how far into it the voice is, and decides when a page l…

npx shadcn@latest add https://www.remocn.dev/r/caption-core.json
Caption Karaoke component

Transcript captions where each word fills with colour left to right exactly as it is spoken, the whole phrase readable before the voice reaches it.

npx shadcn@latest add https://www.remocn.dev/r/caption-karaoke.json
Caption Highlight Box component

A solid box travels behind the word being spoken, sliding from word to word as the voice moves on.

npx shadcn@latest add https://www.remocn.dev/r/caption-highlight-box.json
Caption Active Pop component

The word being spoken turns to the accent colour and springs up in scale, then settles back as the voice moves on.

npx shadcn@latest add https://www.remocn.dev/r/caption-active-pop.json
Caption Word Pop component

One large word at a time, each popping in on a spring the moment it is spoken.

npx shadcn@latest add https://www.remocn.dev/r/caption-word-pop.json
Caption Bounce In component

Each word springs up into place with a little overshoot the moment it is spoken, and the phrase builds word by word.

npx shadcn@latest add https://www.remocn.dev/r/caption-bounce-in.json
Caption Blur In component

Each word resolves out of a soft blur the moment it is spoken, for captions that arrive quietly.

npx shadcn@latest add https://www.remocn.dev/r/caption-blur-in.json
Caption Rise component

Each word slides up out of a mask at its baseline the moment it is spoken, with no bounce and no scale.

npx shadcn@latest add https://www.remocn.dev/r/caption-rise.json
Caption Typewriter component

Each word types out character by character at the pace it is spoken, with a caret that blinks while the speaker pauses.

npx shadcn@latest add https://www.remocn.dev/r/caption-typewriter.json
Caption Slot component

One short line at a time, each new phrase rolling up into place as the previous one rolls out the top.

npx shadcn@latest add https://www.remocn.dev/r/caption-slot.json
Caption Subtitle component

Classic broadcast subtitles, a whole phrase on a translucent plate, with no word-level animation at all.

npx shadcn@latest add https://www.remocn.dev/r/caption-subtitle.json
Caption Dim Progress component

The whole phrase sits on screen dimmed and each word brightens the moment it is spoken, with no motion at all.

npx shadcn@latest add https://www.remocn.dev/r/caption-dim-progress.json
Caption Underline component

A bar slides under the word being spoken, travelling from word to word while the text itself stays untouched.

npx shadcn@latest add https://www.remocn.dev/r/caption-underline.json
Caption Scramble component

Each word arrives as random glyphs at the moment it is spoken and decodes left to right into the real letters.

npx shadcn@latest add https://www.remocn.dev/r/caption-scramble.json
Caption Weight component

The word being spoken swells from a light weight to a heavy one and relaxes as the voice moves on, with no layout shift.

npx shadcn@latest add https://www.remocn.dev/r/caption-weight.json
Caption Emoji component

An emoji pops up above a chosen word the moment it is spoken and stays until the phrase leaves.

npx shadcn@latest add https://www.remocn.dev/r/caption-emoji.json
Caption Speaker component

Dialogue captions where every phrase takes its speaker's colour, so a conversation reads like a script.

npx shadcn@latest add https://www.remocn.dev/r/caption-speaker.json
Caption Stack component

Kinetic captions stacked a couple of words per line, with the keyword of each page set large on its own line.

npx shadcn@latest add https://www.remocn.dev/r/caption-stack.json
Caption Outline component

Heavy-stroked captions that stay readable over any footage, with the spoken word switching to a contrast colour and nothing else moving.

npx shadcn@latest add https://www.remocn.dev/r/caption-outline.json
Caption Marker component

Plain captions where the words that matter get a highlighter swipe the moment they are spoken.

npx shadcn@latest add https://www.remocn.dev/r/caption-marker.json
Caption Stamp component

Plain captions where the words that matter slam down as a rubber stamp the moment they are spoken.

npx shadcn@latest add https://www.remocn.dev/r/caption-stamp.json
Caption Handwrite component

Each word is inked in by hand from left to right at the pace it is spoken, every word sitting at its own slight angle.

npx shadcn@latest add https://www.remocn.dev/r/caption-handwrite.json
Caption Redact component

The whole phrase starts blacked out like a declassified file, and each bar pulls away the moment its word is spoken.

npx shadcn@latest add https://www.remocn.dev/r/caption-redact.json
Caption Prosody component

Word size follows the delivery, so drawn-out words land large and rushed words stay small, and the rhythm of the voice is visible with the sound off.

npx shadcn@latest add https://www.remocn.dev/r/caption-prosody.json
Caption Timeline component

The whole transcript laid out on a scrolling time strip that slides under a fixed playhead, so every pause shows up as space between words.

npx shadcn@latest add https://www.remocn.dev/r/caption-timeline.json
Caption Teleprompter component

The whole transcript scrolls smoothly through a short window with the current line centred, past lines fading above and the next line waiting below.

npx shadcn@latest add https://www.remocn.dev/r/caption-teleprompter.json
Caption Knockout component

A solid plate with the words cut clean through it, each word punching out the moment it is spoken so the footage shows through the letters.

npx shadcn@latest add https://www.remocn.dev/r/caption-knockout.json
Caption Slice component

Each word arrives cut in two, the top half sliding in from the left and the bottom from the right, locking together the moment it is spoken.

npx shadcn@latest add https://www.remocn.dev/r/caption-slice.json
Caption Cube component

Each new phrase turns into view as the next face of a 3D cube, the previous phrase rotating up and away on a horizontal hinge.

npx shadcn@latest add https://www.remocn.dev/r/caption-cube.json
Caption Split Flap component

Every letter sits on its own flap tile and clatters through a few characters before landing the moment the word is spoken, like a station departure board.

npx shadcn@latest add https://www.remocn.dev/r/caption-split-flap.json
Caption Label Maker component

Each phrase is punched letter by letter into a strip of embossing tape at the pace it is spoken, the tape feeding out as the words arrive.

npx shadcn@latest add https://www.remocn.dev/r/caption-label-maker.json
Caption Drop component

Each word falls into place from above and bounces as it lands the moment it is spoken, and the whole phrase drops out of frame when the speaker pauses.

npx shadcn@latest add https://www.remocn.dev/r/caption-drop.json
Iris Wipe component

An old-cartoon iris closes on the subject, holds a beat as a dot, then opens on the next scene.

npx shadcn@latest add https://www.remocn.dev/r/iris-wipe.json
Venetian Blinds component

The outgoing scene splits into horizontal slats that turn edge-on in a staggered ripple, revealing the next scene behind them.

npx shadcn@latest add https://www.remocn.dev/r/venetian-blinds.json