We built our 20-second launch video entirely in code (React, CSS and no 3D library)

We built our 20-second launch video entirely in code (React, CSS and no 3D library)

We needed a launch video for Spicrawl, our web scraping API for AI agents. We didn't have a motion designer or After Effects, so we built the whole thing in code. It's React, CSS and a bit of SVG, rendered to MP4 with Remotion. Even the music is generated in JavaScript.

Here's the result 👇

Below is how each part works, in case you want to try it.

The setup: Remotion

Remotion lets you write a video as React components. Each frame is a render of your components at a given frame number. You animate by reading the current frame and computing styles from it:

const frame = useCurrentFrame()
const opacity = interpolate(frame, [0, 18], [0, 1], { extrapolateRight: 'clamp' })
return <h1 style={{ opacity }}>Scrape.</h1>

If you're building apps or AI agents that need live web data, check out Spicrawl. It provides a web scraping API and MCP to help you extract data from websites and use it in your projects.

Spicrawl is currently free to try during beta.