One shared library. Take what fits.
Components, sounds, images and overlays that people shared from their own videos. Find one here, then pull it by its id.
Reelkit is free, and browsing is open to everyone. Pulling needs the CLI and a free account: run reelkit auth login and sign in with an email link.
Results
24 items shown
App
Dock A desktop dock: a glass bar of app icons that slides up, magnifies under a passing pointer, and bounces the app being opened. Uses the kit's real logo marks; show only apps the video refers to.
Usage
<AppDock apps={["gmail", "googlecalendar", "notion", "zoom", "spotify", "discord", "github"]} launch={2} bottom={0.38} size={0.09} />reelkit assets pull cmp-appdockApp
Install Card An app store listing row: icon, name, rating and a Get button that is tapped, fills a download ring and turns into Open. Pass the app's real icon as iconSrc={urls[key]} and its real rating. Variants: light, dark.
Usage
<AppInstallCard name="Daybreak" subtitle="Plan your day in a minute" glyph="calendar" rating={4.8} ratingCaption="12K ratings" pressAt={22} />reelkit assets pull cmp-appinstallcardLaptop
Mockup A laptop whose lid swings open as it rises into frame, showing the user's real screenshot on its screen. Pass src={urls[key]} of an uploaded screenshot; never fake an app screen. Bodies: silver, dark.
Usage
<LaptopMockup size={0.7} />reelkit assets pull cmp-laptopmockupDynamic
Island The black pill at the top of a phone that stretches open to show a live activity (a call, a song, a timer, a delivery) with the app's icon and moving sound bars or a time, then shrinks back.
Usage
<DynamicIsland title="Dana Levi" subtitle="Incoming call" icon="phone" top={0.36} />reelkit assets pull cmp-dynamicislandBento
Grid A keynote-style feature grid: rounded tiles of different widths on black, each with one big gradient figure and a short label, coming into focus one after another. The whole product on one screen. Pass only real figures.
Usage
<BentoGrid heading="Everything in one place" tiles={[{ value: "18 hrs", label: "Battery life", wide: true }, { value: "2x", label: "Faster exports" }, { value: "4K", label: "Video at 60 frames" }, { value: "1 TB", label: "Cloud storage" }, { value: "24/7", label: "Support from real people" }]} />reelkit assets pull cmp-bentogridTouch
Tap The round touch marker of a screen recording: it appears, presses with a ring, or drags along for a swipe. Lay it over a phone screenshot to show taps and swipes. Positions are fractions of the frame.
Usage
<TouchTap taps={[{ x: 0.3, y: 0.4 }, { x: 0.7, y: 0.6, to: { x: 0.35, y: 0.6 } }, { x: 0.5, y: 0.3 }]} size={0.07} />reelkit assets pull cmp-touchtapCollab
Cursors Several coloured pointers with name tags moving around at once, as when a team works in the same file. Lay it over a screenshot or a design to say together, live. Positions are fractions of the frame.
Usage
<CollabCursors people={[{ name: "Maya", points: [{ x: 0.15, y: 0.3 }, { x: 0.4, y: 0.55 }, { x: 0.3, y: 0.7 }] }, { name: "Tom", points: [{ x: 0.8, y: 0.75 }, { x: 0.6, y: 0.35 }, { x: 0.72, y: 0.5 }] }, { name: "Lin", points: [{ x: 0.5, y: 0.15 }, { x: 0.55, y: 0.7 }, { x: 0.2, y: 0.5 }] }]} size={0.05} />reelkit assets pull cmp-collabcursorsCursor
Click A mouse pointer that glides between points and clicks, with a press and an expanding ring, and an optional name tag. Lay it over a screenshot or a mockup to show someone using the product. Positions are fractions of the frame.
Usage
<CursorClick points={[{ x: 0.2, y: 0.75 }, { x: 0.5, y: 0.45, click: true }, { x: 0.74, y: 0.3, click: true }]} moveEvery={30} size={0.06} />reelkit assets pull cmp-cursorclickShimmer
Skeleton A loading card: grey placeholder lines with a band of light sweeping across them, which then resolve into the real title and text. For generating, loading and waiting versus ready. Variants: light, dark.
Usage
<ShimmerSkeleton title="Your summary is ready" text="Three key points and the next steps, pulled from a forty-page report." resolveAt={50} />reelkit assets pull cmp-shimmerskeletonGlow
Orb A glowing orb of swirling colour that breathes and pulses like a voice assistant that is listening or speaking, with an optional line under it. Raise energy while it speaks.
Usage
<GlowOrb label="How can I help?" energy={0.7} size={0.46} />reelkit assets pull cmp-gloworbAgent
Steps An AI agent at work: a card of tasks where the current one spins and shimmers, then gets a tick as the next one starts, with a small result beside each finished task. Use doneAt to time each step to the narration. Variants: light, dark.
Usage
<AgentSteps heading="Working on it" steps={[{ title: "Searching the web", detail: "12 sources" }, { title: "Reading the results", detail: "8 pages" }, { title: "Comparing prices" }, { title: "Writing the summary" }]} stepEvery={20} />reelkit assets pull cmp-agentstepsStreaming
Answer An AI chat exchange: the question lands as a bubble, a 'thinking' line shimmers, then the answer streams in word by word behind a soft cursor. Use the product's real answer; never invent what an AI said. Variants: light, dark.
Usage
<StreamingAnswer question="How do I get more from my day?" answer="Start with the one task that matters most, protect two quiet hours for it, and leave email until after lunch." thinkFrames={20} speed={0.6} />reelkit assets pull cmp-streaminganswerPrompt
Box An AI prompt box with a glowing, slowly turning gradient border: the request is typed in after a sparkle, then the send button is pressed. Optional suggestion chips underneath. Variants: light, dark.
Usage
<PromptBox prompt="Plan a three-day trip to Lisbon on a small budget" chips={["Summarise a file", "Write an email", "Plan a trip"]} />reelkit assets pull cmp-promptboxGlitch
Text A heavy title that tears: its colours split apart and slices of it jump sideways in short bursts, then it holds still. For warnings, breaking news, errors and edgy openers.
Usage
<GlitchText text="System error" subtitle="Something broke" every={24} />reelkit assets pull cmp-glitchtextWord
Rotate A fixed line with a slot under it where words roll in from below and out through the top, the last one staying: built for designers, founders, teams. Words can sit on a solid block of the hero colour.
Usage
<WordRotate lead="Built for" words={["designers", "founders", "everyone"]} every={24} boxed />reelkit assets pull cmp-wordrotateGradient
Text A big headline filled with a gradient whose colours keep flowing through the letters, with a band of light passing over it once. Optional plain lines above and below. For a product name or the one big claim.
Usage
<GradientText overline="Say hello to" text="Aurora" subtitle="Your whole workflow, in one place" size={0.16} />reelkit assets pull cmp-gradienttextBlur
Reveal A calm, premium headline: each word (or letter) comes into focus out of a soft blur, one after another, as in a product film. Optional small line above and words in the hero colour.
Usage
<BlurReveal overline="Introducing" text="The fastest way to tell your story" accent={["fastest"]} size={0.075} />reelkit assets pull cmp-blurrevealScramble
Text A title that decodes itself: every letter flickers through random characters and settles from left to right, with a small line under it. For tech, security, data and reveals.
Usage
<ScrambleText text="Access granted" subtitle="Welcome back" />reelkit assets pull cmp-scrambletextTypewriter
Text A headline typed out letter by letter behind a blinking caret. Give it endings and it cycles through them: each is typed, held, deleted and replaced, and the last one stays, in the hero colour.
Usage
<TypewriterText text="Make videos for " endings={["TikTok", "Reels", "anything"]} speed={0.9} hold={10} size={0.058} />reelkit assets pull cmp-typewritertextReaction
Pills A chat message with emoji reaction pills popping in under it, their counts ticking up, and one of them being tapped. For team chat, community and feedback moments. Use a real message and real counts. Variants: light, dark.
Usage
<ReactionPills author="Noa" message="We just crossed ten thousand sign-ups!" reactions={[{ emoji: "🎉", count: 24 }, { emoji: "🔥", count: 12 }, { emoji: "❤️", count: 9 }, { emoji: "👏", count: 7 }]} picked={0} pickAt={40} />reelkit assets pull cmp-reactionpillsEmoji
Reactions A stream of emoji that float up from the bottom, swaying and fading, like reactions on a live video. Lay it over anything; rises from the right, the left or the whole width. Emoji are drawn in the emoji style of the machine that renders the video.
Usage
<EmojiReactions emojis={["❤️", "🔥", "😂", "👏", "😍"]} side="full" count={40} every={2} size={0.06} />reelkit assets pull cmp-emojireactionsEmoji
Pop Big emoji that bounce in one after another with a squash, a wiggle and a burst of rays behind them. A reaction the viewer cannot miss. Place it anywhere. Emoji are drawn in the emoji style of the machine that renders the video.
Usage
<EmojiPop emojis={["🔥", "🚀", "🎉"]} size={0.16} />reelkit assets pull cmp-emojipopWaveform
A row of sound bars that dance like a voice or a track playing, with an optional label and quiet stretches. For podcasts, voice notes, music and voice assistants. It is drawn, not measured from the audio.
Usage
<Waveform label="Now playing" bars={36} />reelkit assets pull cmp-waveformPrice
Drop A price cut: the old price appears, a line strikes through it and it shrinks away as the new price slams in with a saving tag beside it. Pass the real prices and the real saving only.
Usage
<PriceDrop label="This week only" oldPrice="$99" newPrice="$59" badge="Save $40" />reelkit assets pull cmp-pricedrop