Get started.
Try it locally.

Editframe lets you build videos with code — HTML + CSS compositions that render to MP4. No account required for local evaluation.

Pricing and license eligibility

Want to create videos with Codex, Cursor, or Claude Code? Try the agent preview for guided setup and a live local editor.

Use an AI agent

Copy a prompt and paste it into Claude, Cursor, Codex, or any AI coding tool. Your agent installs the skills, then scaffolds a new project or integrates into an existing one.

Use the CLI

Scaffold a project yourself with the CLI and follow the steps below. Full control, no surprises.

Zero to video in 4 steps

Use Node.js 22.12 or later. No account or API key needed for local evaluation.

1

Scaffold a project

Run the create command to generate a starter composition and configure the CLI.

$ npm create @editframe@latest

Choose the html template for plain HTML/CSS, or react for TypeScript + React.

2

Edit your composition

Open the generated project directory in your editor.

HTML: Edit index.html to change the composition.

React: Edit src/Video.tsx to change the composition.

HTML example

<ef-timegroup mode="sequence" class="w-[1920px] h-[1080px] bg-black">
  <ef-timegroup mode="fixed" duration="3s" class="absolute w-full h-full">
    <ef-text class="text-white text-6xl font-bold">Hello, Editframe!</ef-text>
  </ef-timegroup>
</ef-timegroup>

Edit this freely. Add images, video, audio, CSS animations — anything the browser can render.

3

Preview in the browser

From the generated project directory, start the dev server to preview your changes.

$ npm start

Prints a localhost URL when ready. Hot-reloads on save.

4

Render to MP4

When you're happy with the composition, render it to an MP4 file locally — no account or cloud needed.

$ npx editframe render -o output.mp4

The CLI launches a headless browser, captures frames, and encodes to MP4 using FFmpeg.

What's next