nexu-io/html-video

Programmatic video for coding agents — HTML to video on your laptop. Turn HTML, CSS & data into real MP4s with pluggable render engines, 21 templates, AI soundtrack. Apache-2.0, no per-render fees. An official project by the Open Design team.

What it solves

html-video allows users to create fully animated MP4 videos from simple text prompts, web articles, or GitHub repositories without needing to learn complex video editing software or specific animation DSLs. It acts as a meta-layer that abstracts away the underlying rendering engines, allowing a coding agent to handle the content creation, storyboarding, and engine selection.

How it works

The system follows a pipeline where a source (prompt, link, or repo) is fetched and flattened to Markdown. A local coding agent then analyzes this material and a chosen template to create a "content-graph" storyboard. This storyboard is broken down into individual animated HTML frames. These frames are rendered via a headless Chromium browser (using the Hyperframes engine by default) and encoded into an MP4 file using ffmpeg. Optional AI-generated music and narration (via MiniMax) can be mixed into the final export.

Who it’s for

Content creators, developers, and marketers who want to quickly turn technical documentation, articles, or ideas into professional-looking animated videos for product reveals, social shorts, or explainers.

Highlights

  • Agent-Driven Workflow: Supports 14 different local coding agents (e.g., Claude Code, Cursor, Aider) to automate the video generation process.
  • Multi-Source Input: Directly converts web articles (including WeChat) and GitHub repositories into structured video scripts.
  • Pluggable Rendering Engines: Uses a standardized adapter interface to support multiple engines, with Hyperframes currently shipped and Remotion/Motion Canvas on the roadmap.
  • Local Rendering: Renders real MP4s locally on the user's machine via Chromium and ffmpeg, avoiding cloud fees and vendor lock-in.
  • Curated Template Gallery: Includes 21 license-clean templates for data visualization, kinetic type, and cinematic frames.
  • AI Soundtrack: Integrates MiniMax for AI-generated background music and text-to-speech narration.

Related

  • Project
    heygen-com/hyperframes

    HyperFrames is an open‑source Node.js framework that lets you describe a video as ordinary HTML + CSS (with special `data-*` timing attributes) and render it to a deterministic MP4. It ships a set of “skills” that AI coding agents can load, so an LLM can be prompted to create product‑launch videos, PR walkthroughs, explainer clips, motion graphics, etc., automatically generating the HTML, pulling assets, lint‑checking, previewing, and finally rendering via a CLI (`hyperframes render`). The system supports many animation runtimes (GSAP, Lottie, Three.js, CSS, etc.), a unified media manager, optional cloud/Lambda rendering, and a catalog of reusable design blocks. Ideal for AI‑driven video generation pipelines and designers who want a web‑first, code‑centric video authoring workflow.

  • Project
    pexoai/pexo-skills

    A set of open-source agent skills that automate the full video production pipeline, transforming text, images, or URLs into finished multi-shot videos with music and subtitles.

  • Project
    oil-oil/oil-motion

    Oil Motion is an AI‑agent skill that turns design prompts and source images into interactive web animations (scroll‑driven, mouse‑follow, touch, etc.). It automates key‑frame creation, AI video generation, frame‑level cleaning, and packaging into MP4 or WebP assets, then provides ready‑to‑embed front‑end code.

  • Project
    HKUDS/VideoAgent

    An all-in-one agentic framework for understanding, editing, and generating creative videos through natural language prompts.

  • Project
    Sayhi-bzb/Agent-HTML

    A framework that enables AI agents to generate interactive React-based HTML artifacts instead of plain Markdown, allowing for complex layouts, dashboards, and stateful interfaces.