Field notes
Paste a snippet and export a glowing, typed-out code clip as MP4 — square for X, vertical for Reels, Shorts, and TikTok. A Remotion composition with VS Code-grade highlighting and a live browser preview.
CodePulse turns any snippet into a 10-second social clip. The code types itself into a floating editor with a glowing cursor, an active-line highlight, and syntax colors from Shiki — the same grammar engine behind VS Code. When the last character lands, a “compiled” toast pops in, then the editor clears and the clip loops without a seam.
Edit the title, filename, handle, and code on the page and the preview updates instantly. pnpm render exports a 1080×1080 MP4 and pnpm render:vertical a 1080×1920 one; the first render downloads a headless Chrome. Clips are silent. Remotion is free for individuals and companies of up to 3 people; larger for-profit companies need a Remotion Company License.
Inside the prompt
Every file below is written out in full, so your agent creates the project exactly — no guessing, no missing pieces.
codepulse/
├─ .gitignore
├─ index.html
├─ package.json
├─ tsconfig.json
├─ vite.config.ts
└─ src/
├─ App.tsx
├─ index.css
├─ main.tsx
├─ vite-env.d.ts
├─ lib/
│ └─ loop.ts
└─ remotion/
├─ CodePulse.tsx
├─ highlight.ts
├─ index.ts
├─ Root.tsx
└─ theme.tsRecut it
- Change the default snippet, title, and handle
src/remotion/Root.tsx → DEFAULT_PROPS - Recolor the syntax theme
src/remotion/theme.ts → COLORS - Type faster or hold the finished code longer
src/remotion/CodePulse.tsx → TYPE_END - Highlight another language
src/remotion/highlight.ts → langs - Add a new video size
src/remotion/Root.tsx → <Composition>
Also in the vault
Monolith
3D InteractiveA floating hexagonal basalt monolith split by glowing cyan fissures, with drifting debris, a light shaft, and pointer parallax. Procedural GLSL stone — no textures, no models, no network.
Kinetics
Scroll HeroA dark SaaS hero where giant type slides with scroll inertia, glass stat cards tick like a live dashboard, and a frosted dock magnifies under the pointer. Pure DOM and Framer Motion — no canvas, no images.