Brand Wheel — Remotion rotating logos animation

Q: How do I add Brand Wheel to a Remotion project?

Run npx shadcn@latest add @snapcn/brand-wheel. The source is copied into components/snap-cn/ (or wherever your components.json points) with anything it depends on, and you own the code from then on — there is no runtime package to keep installed.

Q: What do I need before using Brand Wheel?

An existing Remotion project (npx create-video@latest) with a components.json. shadcn init does not recognise Remotion, so the installation guide has you write that file by hand — it takes two minutes. The component is MIT licensed and free.

Installation

$ pnpm dlx shadcn@latest add @snapcn/brand-wheel

Needs an existing Remotion project and a components.json. Two-minute setup if this is your first snapcn component.

How it works

Component code

The exact files shadcn add copies into your project.

Usage

Six items run 139 frames at 30fps; each extra item adds 20 (brandWheelDuration(n)). The wheel comes to rest on the last item. Known brands get their mark, anything else its initial.

import { BrandWheel } from "@/components/snap-cn/brand-wheel";

export const Beat = () => (
  <BrandWheel lead="launch on" items="X, YouTube, LinkedIn, Instagram, TikTok, Product Hunt" />
);

Frequently asked questions

How do I add Brand Wheel to a Remotion project?

Run npx shadcn@latest add @snapcn/brand-wheel. The source is copied into components/snap-cn/ (or wherever your components.json points) with anything it depends on, and you own the code from then on — there is no runtime package to keep installed.

What is Brand Wheel?

Brand Wheel is a Remotion rotating logos animation for React. A lead word and a wheel of brand pills rolling through where you ship — X, YouTube, LinkedIn, Product Hunt — until a cursor clicks the last one.

What do I need before using Brand Wheel?

An existing Remotion project (npx create-video@latest) with a components.json. shadcn init does not recognise Remotion, so the installation guide has you write that file by hand — it takes two minutes. The component is MIT licensed and free.