# Imgcli

> Imgcli is a shadcn-style registry of Remotion components for product demos, launch videos and social clips. Install free components with `npx shadcn@latest add https://imgcli.com/r/<name>.json`. The CLI copies the source and its dependencies into your project.

To use `@imgcli/<name>`, configure the mapping in the [installation guide](https://imgcli.com/docs/getting-started/installation).

Set up the Remotion project's `components.json` and `@/` alias using the installation guide. The free component source is MIT licensed.

The [Video Editor](https://imgcli.com/docs/video-editor) exports MP4 without a Remotion project. Sign in to save and reopen projects and share an exported video by link. New Pro purchases are paused. See the [Roadmap](https://imgcli.com/docs/roadmap) for what's available and what's next.

Operated by Liqi Labs. The MIT-licensed source is based on snapcn by Sri Nath.
Last updated: 2026-11-12 (newest component release)

Building a video? Start at https://imgcli.com/llms-components.txt — every installable
component in one table with what it is for, how many frames it runs and what it
pulls in, linking to each component's full page. Any docs URL also serves raw
markdown: append `.md`.

For agent setup, see https://imgcli.com/docs/getting-started/agent-skill.

## Every installable component

These 65 items are the complete set available from the free Imgcli registry. Use the names below and do not infer, pluralise or invent entries.

- `npx shadcn@latest add https://imgcli.com/r/answer-highlight.json`
- `npx shadcn@latest add https://imgcli.com/r/agent-steps.json`
- `npx shadcn@latest add https://imgcli.com/r/announce-title.json`
- `npx shadcn@latest add https://imgcli.com/r/answer-stream.json`
- `npx shadcn@latest add https://imgcli.com/r/text-reveal.json`
- `npx shadcn@latest add https://imgcli.com/r/text-highlight.json`
- `npx shadcn@latest add https://imgcli.com/r/text-rewrite.json`
- `npx shadcn@latest add https://imgcli.com/r/text-select.json`
- `npx shadcn@latest add https://imgcli.com/r/text-swap.json`
- `npx shadcn@latest add https://imgcli.com/r/text-swell.json`
- `npx shadcn@latest add https://imgcli.com/r/text-build.json`
- `npx shadcn@latest add https://imgcli.com/r/word-flip.json`
- `npx shadcn@latest add https://imgcli.com/r/word-captions.json`
- `npx shadcn@latest add https://imgcli.com/r/karaoke-captions.json`
- `npx shadcn@latest add https://imgcli.com/r/logo-drift.json`
- `npx shadcn@latest add https://imgcli.com/r/logo-assemble.json`
- `npx shadcn@latest add https://imgcli.com/r/logo-flicker.json`
- `npx shadcn@latest add https://imgcli.com/r/block-wordmark.json`
- `npx shadcn@latest add https://imgcli.com/r/phone-frame.json`
- `npx shadcn@latest add https://imgcli.com/r/laptop-frame.json`
- `npx shadcn@latest add https://imgcli.com/r/terminal-simulator.json`
- `npx shadcn@latest add https://imgcli.com/r/screen-recording.json`
- `npx shadcn@latest add https://imgcli.com/r/count-grid.json`
- `npx shadcn@latest add https://imgcli.com/r/roster-grant.json`
- `npx shadcn@latest add https://imgcli.com/r/wordmark-cut.json`
- `npx shadcn@latest add https://imgcli.com/r/cursor-track.json`
- `npx shadcn@latest add https://imgcli.com/r/pulsing-border.json`
- `npx shadcn@latest add https://imgcli.com/r/follower-rush.json`
- `npx shadcn@latest add https://imgcli.com/r/prompt-send.json`
- `npx shadcn@latest add https://imgcli.com/r/prompt-zoom.json`
- `npx shadcn@latest add https://imgcli.com/r/punch-lines.json`
- `npx shadcn@latest add https://imgcli.com/r/orbit-gallery.json`
- `npx shadcn@latest add https://imgcli.com/r/hero-launch.json`
- `npx shadcn@latest add https://imgcli.com/r/moodboard-reveal.json`
- `npx shadcn@latest add https://imgcli.com/r/reel-collage.json`
- `npx shadcn@latest add https://imgcli.com/r/reel-wall.json`
- `npx shadcn@latest add https://imgcli.com/r/phone-stack.json`
- `npx shadcn@latest add https://imgcli.com/r/portal-intro.json`
- `npx shadcn@latest add https://imgcli.com/r/dot-bloom.json`
- `npx shadcn@latest add https://imgcli.com/r/hello-zoom.json`
- `npx shadcn@latest add https://imgcli.com/r/spec-sweep.json`
- `npx shadcn@latest add https://imgcli.com/r/drop-line.json`
- `npx shadcn@latest add https://imgcli.com/r/title-sweep.json`
- `npx shadcn@latest add https://imgcli.com/r/cut-lockup.json`
- `npx shadcn@latest add https://imgcli.com/r/bloom-lockup.json`
- `npx shadcn@latest add https://imgcli.com/r/gather-lockup.json`
- `npx shadcn@latest add https://imgcli.com/r/sky-lockup.json`
- `npx shadcn@latest add https://imgcli.com/r/search-typing.json`
- `npx shadcn@latest add https://imgcli.com/r/status-cycle.json`
- `npx shadcn@latest add https://imgcli.com/r/type-morph.json`
- `npx shadcn@latest add https://imgcli.com/r/orb-swarm.json`
- `npx shadcn@latest add https://imgcli.com/r/word-gather.json`
- `npx shadcn@latest add https://imgcli.com/r/word-wheel.json`
- `npx shadcn@latest add https://imgcli.com/r/brand-wheel.json`
- `npx shadcn@latest add https://imgcli.com/r/check-cycle.json`
- `npx shadcn@latest add https://imgcli.com/r/font-shuffle.json`
- `npx shadcn@latest add https://imgcli.com/r/button-press.json`
- `npx shadcn@latest add https://imgcli.com/r/click-type.json`
- `npx shadcn@latest add https://imgcli.com/r/capture-reveal.json`
- `npx shadcn@latest add https://imgcli.com/r/channel-thread.json`
- `npx shadcn@latest add https://imgcli.com/r/logo-collapse.json`
- `npx shadcn@latest add https://imgcli.com/r/card-rail.json`
- `npx shadcn@latest add https://imgcli.com/r/snap-cn-ui.json`
- `npx shadcn@latest add https://imgcli.com/r/caret.json`
- `npx shadcn@latest add https://imgcli.com/r/input.json`

Full docs as one file: https://imgcli.com/llms-full.txt

## getting-started

- [Use Imgcli with an AI agent](https://imgcli.com/docs/getting-started/agent-skill): Install Imgcli Skills and plugins from the public repository to build Remotion videos with a coding agent.
- [Installation](https://imgcli.com/docs/getting-started/installation): Set up your Remotion project's aliases and install a free Imgcli component with the shadcn CLI.
- [Introduction](https://imgcli.com/docs/getting-started/introduction): What Imgcli is and who it's for — Remotion components you install with the shadcn CLI and own as code in your project.
- [License](https://imgcli.com/docs/getting-started/license): MIT licensing for Imgcli's free Remotion component source and support for existing licenses.

## components

- [Components](https://imgcli.com/docs/components): Imgcli components, grouped by category

## text

- [Text & Titles](https://imgcli.com/docs/text): Kinetic headlines, reveals, swaps, highlights and lower thirds — the decorative title layer of a video.
- [Brand Wheel](https://imgcli.com/docs/text/brand-wheel): A lead word and a wheel of brand pills rolling through where you ship, until a cursor clicks the last one
- [Check Cycle](https://imgcli.com/docs/text/check-cycle): A sentence that finishes itself over and over — the word beside a ticked checkbox rolls up out of a slot, Intros, Demos, Launches, Changelogs, Tutorials, And more — then the line steps back a little and rests
- [Drop Line](https://imgcli.com/docs/text/drop-line): Words cut past one card at a time, then the last word sinks out from under the dot of its own i
- [Font Shuffle](https://imgcli.com/docs/text/font-shuffle): A launch title that decodes out of scrambled glyphs, flashes the accent, settles to ink, then the product name tries on eleven typefaces while the line steps closer
- [Hello Zoom](https://imgcli.com/docs/text/hello-zoom): Words flicker in place, one line types on, then the camera dives through its own letters into the next card
- [Punch Lines](https://imgcli.com/docs/text/punch-lines): Full-frame title cards that cut hard between beats — a statement flicked in line by line and rushed past the camera, then a hero line whose words punch up from a third of their size and push slowly forward until it cuts
- [Spec Sweep](https://imgcli.com/docs/text/spec-sweep): A one-line spec slides in word by word while a highlight runs along it and an icon charges up
- [Text Build](https://imgcli.com/docs/text/text-build): Words enter one at a time while the already-placed words physically reflow to stay centered — on the x axis as a growing line or the y axis as a growing stack
- [Text Highlight](https://imgcli.com/docs/text/text-highlight): A mark wipes a wordmark open, spins into its lockup, then swings wide and comes round past the lens while its ink floods the frame — plus five span-emphasis presets
- [Text Reveal](https://imgcli.com/docs/text/text-reveal): A cinematic zoom-out title reveal — the lead word floats up close to the viewer, falls back to size, then the sentence pushes in word by word and slides into place
- [Text Rewrite](https://imgcli.com/docs/text/text-rewrite): A line writes itself, is selected, then has its opening swept away by a clip that cuts letters in half — and a new ending written on while it slides to its new centre
- [Text Select](https://imgcli.com/docs/text/text-select): A line that writes itself a word at a time, pushes forward to full size, and gets selected under a gradient with a glint travelling across it — the beat before somebody copies it
- [Text Swap](https://imgcli.com/docs/text/text-swap): Replace one line of text with another — by default the old line rushes the camera and flies past you, and the new one is revealed behind it
- [Text Swell](https://imgcli.com/docs/text/text-swell): The lead word rises into the middle and floats toward you — then the rest of the sentence pushes in from the right, bouncing its letters, and shoves the lead word aside before the whole line falls back
- [Title Sweep](https://imgcli.com/docs/text/title-sweep): An end title lit by a gradient that travels through the letters, cuts in the dark, and a second title takes over
- [Type Morph](https://imgcli.com/docs/text/type-morph): A headline that types itself under a glowing caret, sheds its lead, morphs letter by letter, and ends under a colour flood
- [Word Flip](https://imgcli.com/docs/text/word-flip): A headline types itself out, then one word cycles on a 3D flip — sinking into an anticipation dip, throwing up and away about its baseline under motion blur, while the next word unfurls from below.
- [Word Gather](https://imgcli.com/docs/text/word-gather): A sentence that arrives one word at a time, out of order, and gathers — the first word holds the frame alone, then the rest drop in around it in the accent colour and slide the last of the way home, turning to ink as they settle
- [Word Wheel](https://imgcli.com/docs/text/word-wheel): A column of words that spins like a reel and stops on one of them — the lead-in holds the left of the line while the answer rolls into the slot beside it, decelerating over a second and three quarters

## captions

- [Captions](https://imgcli.com/docs/captions): Burned-in, transcript-timed subtitles with word-pop and karaoke styles and safe-area presets for 16:9, 1:1 and 9:16.
- [Karaoke Captions](https://imgcli.com/docs/captions/karaoke-captions): Full-line captions with a progressive fill sweep across the spoken words and accent-colored keyword emphasis
- [Word Captions](https://imgcli.com/docs/captions/word-captions): TikTok-style word-by-word burned-in captions from a timed transcript

## logos

- [Logos](https://imgcli.com/docs/logos): Logo stings and entrances for brand moments in launch videos.
- [Block Wordmark](https://imgcli.com/docs/logos/block-wordmark): A wordmark that builds itself out of solid blocks — a deck shuffles, collapses, splits one block per letter, and each block flashes and cuts to its real letterform
- [Logo Assemble](https://imgcli.com/docs/logos/logo-assemble): A scatter of cards collapses into a brand card that is born tilted and settles — revealing the logo and brand name
- [Logo Collapse](https://imgcli.com/docs/logos/logo-collapse): A stack of shots flicked through, collapsing into your mark, and the wordmark landing beside it — each card smaller and held for less time than the last, cutting rather than tweening, until the stack resolves into a logo
- [Logo Drift](https://imgcli.com/docs/logos/logo-drift): A field of tiles drifting past a headline while the camera pulls steadily back, so the wall of things-it-works-with keeps arriving from every edge
- [Logo Flicker](https://imgcli.com/docs/logos/logo-flicker): Images flip across the screen very fast, the flicker decelerates and fades, and the logo and brand name resolve

## screens

- [Screens & Devices](https://imgcli.com/docs/screens): Phone frames, terminals and AI-product simulations — the demo toolkit.
- [Capture Reveal](https://imgcli.com/docs/screens/capture-reveal): A toast counts "Capturing selection…" up to 100% over a browser window, the window drops away and shrinks, the toast pops to "Copied to clipboard." and a headline rises out from behind the window
- [Cursor Track](https://imgcli.com/docs/screens/cursor-track): A synthetic cursor that moves through waypoints and pulses a ring on click, over any children
- [Laptop Frame](https://imgcli.com/docs/screens/laptop-frame): MacBook-style laptop that opens, runs a notch notification, then dives into the screen until it fills the frame
- [Phone Frame](https://imgcli.com/docs/screens/phone-frame): iPhone-style device frame with a dynamic island and a screen slot — flat, tilted, or a cinematic 3D showcase crane move
- [Phone Stack](https://imgcli.com/docs/screens/phone-stack): Phone screens playing clips rise out of a blur one after another, each pushing the stack back so the older ones peek out on top
- [Screen Recording](https://imgcli.com/docs/screens/screen-recording): Crops the chrome off a raw screen capture, fits it to the frame, and runs a keyframed camera that pushes in on what matters
- [Terminal Simulator](https://imgcli.com/docs/screens/terminal-simulator): Single-camera flythrough — one continuous camera whips from a headline to a package-manager command panel to a zoomed green terminal, all on one canvas

## charts

- [Charts & Stats](https://imgcli.com/docs/charts): Animated scatter plots, line and bar charts, unit charts and count-up counters — the shot where a product video shows its numbers.

## social

- [Social Proof](https://imgcli.com/docs/social): Follower counts, notifications and community milestones — the beat of a video that says other people are already here.
- [Channel Thread](https://imgcli.com/docs/social/channel-thread): A work chat filling itself in — an avatar, a name in bold, a quiet timestamp and messages as plain lines; three dots hold a line until the words arrive, and the transcript scrolls once per arrival and is perfectly still in between
- [Follower Rush](https://imgcli.com/docs/social/follower-rush): An X-style follower notification that piles up — avatars stack in and the count explodes, then the row bends into an undulating wave of faces

## scenes

- [Scenes](https://imgcli.com/docs/scenes): Full scene compositions for launch and demo videos
- [Announce Title](https://imgcli.com/docs/scenes/announce-title): A four-shot announcement title — the eyebrow rushes past the camera on a receding type plane, the name assembles on paper, and a macro pan cuts wide as the tagline builds itself last word first
- [Bloom Lockup](https://imgcli.com/docs/scenes/bloom-lockup): A wall of finished work blooms outward from your logo, cuts in tight on it, then bends away through a lens and a flash while the logo rises to take its wordmark
- [Card Rail](https://imgcli.com/docs/scenes/card-rail): A rail of cards flicked sideways across a tilted plane — the rail leaves at speed, decelerates for over a second and comes to rest about a card further along, while the plane's foot runs a fifth wider than its head
- [Count Grid](https://imgcli.com/docs/scenes/count-grid): A grid of cards rushes in under a horizontal smear and settles on five, then the camera pulls back a fraction while every empty cell fills in from the middle out and the count jumps from five to five hundred
- [Cut Lockup](https://imgcli.com/docs/scenes/cut-lockup): A logo reveal in hard cuts — huge on grid paper, three cuts down, a push to night where its construction lines draw themselves, then paper wipes up onto the lockup
- [Gather Lockup](https://imgcli.com/docs/scenes/gather-lockup): A wall of your work sits under a line of type. The line falls apart word by word, the wall cuts in to a row of four, and each slot swaps its picture and hands over to your mark and wordmark
- [Product Hero](https://imgcli.com/docs/scenes/hero-launch): Cinematic product-launch hero — two cards slide into formation as the headline reveals above
- [Moodboard Reveal](https://imgcli.com/docs/scenes/moodboard-reveal): A kinetic headline, a scattered photo gallery, a camera push from dark to light, landing on a hero image
- [Orb Swarm](https://imgcli.com/docs/scenes/orb-swarm): A sentence told one beat at a time while glass orbs burst out of it, split into eight and sixteen, wind into a vortex, pay out as a chain and loop around the last words before shrinking away bead by bead
- [Orbit Gallery](https://imgcli.com/docs/scenes/orbit-gallery): An image-universe hero — a stream of photos flows along an Archimedean spiral vortex from the frame edges into the center, evenly arc-spaced, shrinking and rotating along the coil, with the title held in the clear middle
- [Portal Intro](https://imgcli.com/docs/scenes/portal-intro): A sentence with a picture chip in it leans in until the chip takes the frame, then a title types over the picture and the mark arrives
- [Reel Collage](https://imgcli.com/docs/scenes/reel-collage): A photo reel between two captions shuts like an eyelid, the copy swaps, and a collage blooms in around the lines
- [Reel Wall](https://imgcli.com/docs/scenes/reel-wall): A curved wall of vertical clips turns past in the dark — it eases in from rest, then keeps turning
- [Roster Grant](https://imgcli.com/docs/scenes/roster-grant): Three rows of roster cards stream past a call to action, a pointer walks in and clicks it, and the monograms start turning to the accent one every seven frames
- [Sky Lockup](https://imgcli.com/docs/scenes/sky-lockup): A one-line promise takes itself apart word by word, the page washes off to a soft sky, and the mark in the middle of the sentence slides over and becomes your logo
- [Status Cycle](https://imgcli.com/docs/scenes/status-cycle): A status pill whose label rolls behind a hard clip while its width springs past the target and back, then the field crossfades to a column of chips stepping up from below
- [Wordmark Cut](https://imgcli.com/docs/scenes/wordmark-cut): A wordmark twice the width of the frame, cooling from a lit gradient to ink, cut closer onto its last letters and the dot

## transitions

- [Transitions](https://imgcli.com/docs/transitions): Effects that carry one shot into the next — lay them over a cut.
- [Dot Bloom](https://imgcli.com/docs/transitions/dot-bloom): A halftone transition — the outgoing shot washes to cream, breaks into warm drifting dots, and the dots thin out onto the incoming shot

## tools

- [Remotion Studio](https://imgcli.com/docs/remotion-studio): Add an Imgcli component to your Remotion project in one click: Remotion Studio on your computer installs it and puts it on your timeline. No CLI needed.
- [Video Editor](https://imgcli.com/docs/video-editor): Compose a video from Imgcli components — add clips, edit text and images, and export an MP4.

## project

- [Changelog](https://imgcli.com/docs/changelog): Remotion component releases in Imgcli, including animations, captions, logo stings, and scenes.
- [Roadmap](https://imgcli.com/docs/roadmap): See what Imgcli supports today and what's next for the Remotion component library.

## blog

- [How to make a demo video for an API or developer tool](https://imgcli.com/api-demo-video): An API has no screen to record. Show the request and the result instead — a terminal, the call, the output, one number — built in React with Remotion so it stays sharp and editable.
- [App Store and Google Play preview videos, made in code](https://imgcli.com/app-store-preview-video): Build App Store app previews and Google Play preview videos in React with Remotion — Apple's exact specs, what Apple allows on screen, what Google Play requires, and one composition that renders both.
- [The best tools for making a product demo video in 2026](https://imgcli.com/best-product-demo-video-tools): Screen recorders, interactive demo builders and code-based video — Screen Studio, Tella, Loom, Cap, Arcade, Supademo, Storylane and Remotion compared on output, platform and price.
- [The best Remotion component libraries in 2026](https://imgcli.com/best-remotion-component-libraries): Every Remotion component library worth knowing in 2026 — Remotion Elements, remocn, RemotionUI, Imgcli and React Video Editor — what each is for, how it installs and what it costs.
- [Free and paid Remotion templates in 2026](https://imgcli.com/best-remotion-templates): Every official create-video template, what the Remotion Store sells and for how much, and the third-party template collections listed in Remotion's docs.
- [The best shadcn-compatible animation libraries in 2026](https://imgcli.com/best-shadcn-animation-libraries): Magic UI, Aceternity UI, Motion Primitives, Animate UI, React Bits, Kokonut UI and Cult UI compared on license, install method, price and animation engine.
- [How to make a changelog video in React](https://imgcli.com/changelog-video-react): Turn every release into a changelog video with Remotion — one React composition, the release notes passed in as props, rendered from the CLI or CI with a single command.
- [Making videos with Claude Code and Remotion](https://imgcli.com/claude-code-remotion-videos): Claude Code can write a whole Remotion video from a brief. Give it Remotion's agent skills, a component library to compose instead of improvised motion, and a prompt with real copy — here is the setup and what agents still get wrong.
- [How to make a GitHub README demo GIF with Remotion](https://imgcli.com/github-readme-demo-gif): Render a crisp, looping demo GIF for your GitHub README with Remotion — the exact CLI flags, how to stay under GitHub's 10MB limit, and when an MP4 is the better choice.
- [Interactive product demo vs video demo: which to make](https://imgcli.com/interactive-demo-vs-video-demo): When a clickable interactive demo beats a product video and when it does not — landing pages, sales, onboarding and launch posts on X and Product Hunt — with the tools for each.
- [What we learned shipping llms.txt for a component registry](https://imgcli.com/llms-txt-component-registry): How to install Imgcli components from the current registry, plus an upstream snapcn case study on llms.txt, Markdown docs, and missing component names.
- [How to make videos with React, programmatically](https://imgcli.com/make-videos-with-react): Remotion turns React components into MP4s. How it works, a minimal composition, rendering one template with many sets of props from the CLI or Node, and when code is the right way to make a video.
- [Product tour and onboarding videos in React](https://imgcli.com/onboarding-video-react): Make product tour and onboarding videos in React with Remotion — one short captioned clip per feature, a screen recording with a camera and a cursor, and every variant rendered from props.
- [How to make a product demo video in React](https://imgcli.com/product-demo-video-react): Build a product demo video in React with Remotion — the five-beat structure that works, a screen recording with a camera and a cursor, and a rendered MP4, all in code.
- [How to make a Product Hunt launch video in code](https://imgcli.com/product-hunt-launch-video): Build your Product Hunt launch video in React with Remotion — a 30–60 second structure that works, a 16:9 master plus a square cut for X and LinkedIn, and which component carries each beat.
- [A 3D card carousel in Remotion](https://imgcli.com/remotion-3d-card-carousel): Build a 3D card carousel in Remotion — a ring of cards in CSS perspective, turned by a flick that decelerates instead of a timer — and when to use a tilted card rail instead.
- [AI chat and prompt animations in Remotion](https://imgcli.com/remotion-ai-chat-animation): How to animate an AI product in Remotion — a prompt typed and sent, an answer streaming in, a highlight on the line that matters, an agent working through steps. A streaming-text effect from scratch, then six ready-made components.
- [Remotion alternatives in 2026](https://imgcli.com/remotion-alternatives): Revideo, Motion Canvas, HyperFrames, Manim, Shotstack and Creatomate compared with Remotion — language, licence, pricing model and when to pick each.
- [Animated backgrounds in Remotion](https://imgcli.com/remotion-animated-backgrounds): Build animated backgrounds in Remotion — a drifting gradient, a moving grid and floating particles — that loop seamlessly and render deterministically, then put your scene on top.
- [How to animate a team chat in Remotion](https://imgcli.com/remotion-chat-animation): Animate a Slack- or Discord-style chat in Remotion — messages that land on set frames, typing dots that hold a line, and a transcript that scrolls once per arrival — then a drop-in component that does it.
- [Confetti in Remotion](https://imgcli.com/remotion-confetti): Build a confetti burst in Remotion without a particle library — seeded random() for each piece, closed-form gravity and air drag so any frame renders on its own, a paper tumble in CSS, and when to fire it.
- [How to animate a number counting up in Remotion](https://imgcli.com/remotion-counter-animation): Animate a number counting up in Remotion — interpolate and round, format with Intl.NumberFormat, stop the width jitter with tabular numbers, and count huge ranges on a log scale — plus drop-in follower and count scenes.
- [Animated cursor and click effects in Remotion](https://imgcli.com/remotion-cursor-animation): Animate a mouse cursor that moves between waypoints and clicks in Remotion — interpolating x and y from the frame, an eased path, a click ring — then a drop-in cursor that walks over any UI or screen recording.
- [Glitch effect in Remotion](https://imgcli.com/remotion-glitch-effect): Build a glitch effect in Remotion from scratch — an RGB split with blended colour layers, horizontal slice displacement with clip-path, deterministic jitter with random(), and bursts on the frames you choose.
- [How to add an iPhone mockup to a Remotion video](https://imgcli.com/remotion-iphone-mockup): Put a screenshot or screen recording inside an iPhone or MacBook frame in Remotion — a from-scratch CSS device around OffthreadVideo, then drop-in components with a dynamic island, a 3D tilt and a camera move.
- [The Ken Burns effect in Remotion](https://imgcli.com/remotion-ken-burns-effect): Make a Ken Burns slow zoom and pan on a photo or screenshot in Remotion — the one rule that stops the image edge showing, why to pan with transform-origin, and why to judge it from a render, not the Player.
- [Kinetic typography in Remotion](https://imgcli.com/remotion-kinetic-typography): Kinetic typography in Remotion — why it is built from cuts rather than tweens, how to set hierarchy and rhythm on a frame clock, a punchy word-scale cut in code, and ready-made components.
- [Rendering Remotion videos: Lambda vs Cloud Run vs your own server](https://imgcli.com/remotion-lambda-vs-self-hosted-rendering): Remotion Lambda, Vercel Sandbox, Cloud Run and @remotion/renderer on your own server compared on speed, cost, setup and limits, from Remotion's docs.
- [Is Remotion free? The Remotion license explained](https://imgcli.com/remotion-license-pricing): Who can use Remotion free, when a Company License is required, what a seat and a render cost, and how headcount, agencies and automations are counted.
- [Logo animations and stings in Remotion](https://imgcli.com/remotion-logo-animation): Build a logo animation in Remotion — what makes a sting land (length, a sound on the hit, an end on a hold), a from-scratch mark-and-wordmark reveal, and six ready-made logo stings.
- [MCP servers for Remotion, explained](https://imgcli.com/remotion-mcp-server): A look at the upstream snapcn MCP integration and the documentation available to agents using Imgcli.
- [Why your Remotion scene transitions look broken](https://imgcli.com/remotion-scene-transitions-overlap): A fade() between two Remotion scenes leaves both of them on screen at full opacity. Here is why, and the one-line fix.
- [Terminal and code-typing animation in Remotion](https://imgcli.com/remotion-terminal-animation): Animate a terminal typing a command and printing output in Remotion — typing from the frame number with slice(), a blinking caret, output that arrives in bursts — then a finished terminal component.
- [How to animate text in Remotion](https://imgcli.com/remotion-text-animations): Animate text in Remotion with useCurrentFrame(), interpolate() and spring() — a word-by-word reveal from scratch, the three bugs that make scaled type look cheap, and ready-made components.
- [TikTok-style captions in Remotion](https://imgcli.com/remotion-tiktok-captions): Burn TikTok-style, word-by-word captions into a Remotion video — the @remotion/captions building blocks, a from-scratch page renderer, and drop-in components that take your Whisper or SRT transcript as-is.
- [Typewriter effect in Remotion](https://imgcli.com/remotion-typewriter-effect): Build a typewriter effect in Remotion — text revealed from the frame number with slice(), a caret that holds solid while typing and blinks when idle, and an eased typing rate that reads as a person rather than a machine.
- [Remotion vs After Effects for launch videos](https://imgcli.com/remotion-vs-after-effects): Remotion makes videos from React code; After Effects is a timeline you drag. For a developer's launch or demo video, here is when each one wins, and why most developers should not open After Effects.
- [Remotion vs Creatomate](https://imgcli.com/remotion-vs-creatomate): Remotion renders React code to video on your own servers; Creatomate renders JSON templates in its cloud via API, spreadsheets or no-code tools. Compared.
- [Remotion vs FFmpeg](https://imgcli.com/remotion-vs-ffmpeg): FFmpeg converts, cuts and encodes media; Remotion draws new frames with React and encodes them with FFmpeg. When you need each, and documented render tips.
- [Remotion vs Framer Motion](https://imgcli.com/remotion-vs-framer-motion): Framer Motion, now called Motion, animates your app's UI in real time. Remotion renders React to a video file, frame by frame. They solve different problems, and Motion's animations do not render inside Remotion. Here is why, and how to use both.
- [Remotion vs Manim](https://imgcli.com/remotion-vs-manim): Remotion renders React components frame by frame; Manim animates math objects in Python. Language, rendering, licence, learning curve and which fits your video.
- [Remotion vs Motion Canvas](https://imgcli.com/remotion-vs-motion-canvas): Remotion renders React components frame by frame; Motion Canvas animates a canvas with TypeScript generators. How they differ in authoring, rendering and licensing, and which one fits a product video.
- [Remotion vs Revideo](https://imgcli.com/remotion-vs-revideo): Remotion renders React components frame by frame; Revideo describes scenes as TypeScript generator functions on a canvas. Authoring, rendering, licence and ecosystem compared, with the same animation written in both.
- [Remotion vs Shotstack](https://imgcli.com/remotion-vs-shotstack): Remotion renders React components to video on your own servers; Shotstack renders a JSON timeline in its cloud. How each works, pricing, and when to pick each.
- [How to make a SaaS demo video without After Effects](https://imgcli.com/saas-demo-video-without-after-effects): No motion designer, no After Effects. Write the script, split it into beats, pick a prebuilt scene per beat, set its props and render — in React, or in the browser with no install.
- [Screen Studio alternatives (Mac, Windows, free and paid)](https://imgcli.com/screen-studio-alternatives): Screen Studio is Mac-only. These alternatives run on Windows, cost less or are free — FocuSee, Cap, Tella, Screenity, OBS Studio and Loom, with platforms and prices checked.
- [How to install Remotion components with the shadcn CLI](https://imgcli.com/shadcn-cli-remotion-components): The shadcn CLI installs Remotion components as source into your video project. Remotion is not a framework shadcn recognises, so it takes three small config steps first — here they are, and the errors you hit without them.
- [snapcn vs remocn: which Remotion component library?](https://imgcli.com/snapcn-vs-remocn): snapcn and remocn both install Remotion components with the shadcn CLI. remocn is wider; snapcn is built around product demo shots. A fair side-by-side, with numbers.
- [Why AI motion graphics all look the same](https://imgcli.com/why-ai-motion-graphics-look-the-same): Ask Claude Code, Codex or Cursor for a Remotion video and you get a centred headline on a gradient that fades in. Why agents converge on that look, and five changes — shots, cuts, scale, real footage, components — that break it.
- [Why AI writes bad Remotion code, and how to fix it](https://imgcli.com/why-ai-writes-bad-remotion-code): Claude Code, Cursor and Codex write Remotion that compiles and still looks wrong — flicker, runaway values, bouncing type, stacked crossfades. The seven mistakes, why an agent makes each one, and the fix.

## docs

- [Documentation](https://imgcli.com/docs): Imgcli is a shadcn registry of Remotion components — install an animation into your own project and own the file.

## ai-input

- [AI Chat Input](https://imgcli.com/docs/ai-input): Prompt bars, search fields and chat composers that type themselves — the shot where a product gets asked a question.
- [Agent Steps](https://imgcli.com/docs/ai-input/agent-steps): An agent narrating its own work — a log that writes itself one line at a time, always on the centre line, and then clears until only the answer is left
- [Answer Highlight](https://imgcli.com/docs/ai-input/answer-highlight): A question, an answer that writes itself, and then a selection dragged across the one sentence that matters — and settled onto one word inside it
- [Answer Stream](https://imgcli.com/docs/ai-input/answer-stream): The beat after send — a macro shot on the button that cuts hard to the answer building itself, while the camera pulls back to keep up with it
- [Prompt Send](https://imgcli.com/docs/ai-input/prompt-send): A composer that unrolls from a hairline, writes a brief while the camera rides the caret, then cuts back out as a pointer arrives and sends it
- [Prompt Zoom](https://imgcli.com/docs/ai-input/prompt-zoom): A prompt field that types a sentence into itself and, partway through, cuts — hard, in a single frame — into the caret and keeps going
- [Search Typing](https://imgcli.com/docs/ai-input/search-typing): A search field wider than the shot — two thirds in frame, then it comes forward, types across its left half, pages to its right half, and goes back

## collections

- [Remotion cursor animations](https://imgcli.com/docs/collections/cursor-animations): A synthetic mouse pointer that moves, hovers and clicks over any UI in a Remotion video — no screen recording, no real cursor to chase.
- [Remotion device mockups](https://imgcli.com/docs/collections/device-mockups): iPhone and MacBook frames for Remotion — put a screenshot or a screen recording inside a device that moves, without leaving React.
- [Remotion image gallery animations](https://imgcli.com/docs/collections/image-galleries): Photo walls, moodboards and 3D card rails for Remotion — the shot that shows a body of work rather than one screen.
- [Remotion terminal animations](https://imgcli.com/docs/collections/terminal-animations): A terminal that types its own commands and prints real output, plus the code and LED-screen shots that go with it — all in React, no screen recording.

## cursor

- [Cursor & Clicks](https://imgcli.com/docs/cursor): Cursors that click, pick and collaborate — the interaction beats of a product video.
- [Button Press](https://imgcli.com/docs/cursor/button-press): A cursor walks onto a split action button: hover, press, a spinner while it works, then a drawn tick
- [Click Type](https://imgcli.com/docs/cursor/click-type): A prompt composer writes its own placeholder while a cursor flies in and clicks the field, then a hard cut into the field where the prompt types at the caret