HTML-to-motion-video compiler
HTML to Motion Video.
Neonix is an HTML-to-motion-video compiler, built for AI agents like Claude, ChatGPT and Grok over Remote MCP.
Neonix is an HTML-to-motion-video compiler. Users — or AI agents like Claude, connected over Remote MCP — write HTML and CSS describing a scene. Neonix validates and compiles it into a canonical motion-video document, then renders it to a real, exportable MP4. It is not a template generator or a prompt-only video tool.
How it works
From markup to a real, exportable video.
Write HTML & CSS
Describe a scene with familiar markup, layout, paint and typography — no new authoring language.
Compile to Protocol V2
Neonix validates the source and compiles it into Neonix Protocol V2, a canonical, semantic motion-video document (JSON).
Preview & edit
Open the project in the Neonix editor to inspect, refine, or hand it back to an agent for another pass.
Export MP4
Render the project through Neonix's native export pipeline into a real, downloadable motion video.
Why it's different
A compiler, not a template filler.
| Template-based AI video tools | Neonix | |
|---|---|---|
| Input | A prompt or a fixed template with a few swappable fields | Arbitrary HTML and CSS you write or an agent generates |
| Output | A flattened render matching a preset look | A structured, editable Protocol V2 document, then a real MP4 |
| Editing after generation | Limited to the template's exposed fields | Every layer and property stays independently editable |
| AI agent access | Usually none, or a closed prompt-only API | Native Remote MCP tools for Claude, ChatGPT and Grok |
Neonix vs Remotion
A compiled pipeline, not a headless browser.
Remotion is a code-first framework for rendering video with React. Neonix compiles HTML/CSS directly into an editable document and exports it through a native, hosted render pipeline.
| Remotion | Neonix | |
|---|---|---|
| Rendering | Headless Chrome takes a screenshot of every frame, then ffmpeg stitches them together — color and fonts can shift between your dev machine and the Linux render server | A native CPU/GPU pipeline with an explicit color space — the same document renders identically on every platform |
| Authoring | React components — requires writing code | Plain HTML/CSS, compiled into an editable Neonix JSON V2 document, with a visual editor for people who don't write code |
| Export | No built-in rendering service — you deploy and manage your own AWS Lambda or GCP Cloud Run | Renders through Neonix's own hosted cloud API from inside the same editor, billed per second of video — no separate deployment to manage |
Neonix vs HyperFrames
Same HTML-first idea, different editing model.
HyperFrames is HeyGen's open-source HTML-to-video renderer for AI agents — the closest idea to Neonix's own approach. Neonix compiles HTML/CSS into a structured, editable document with a visual editor, and renders it natively from inside the same workspace.
| HyperFrames | Neonix | |
|---|---|---|
| Rendering | Headless Chrome captures a screenshot of every frame, then FFmpeg encodes it — the same browser-based mechanism as most code-first video tools | A native CPU/GPU pipeline with an explicit color space — the same document renders identically on every platform |
| Editing after generation | Editing means rewriting the HTML/CSS/JS source and re-rendering — no visual editor for people who don't write code | Compiles into a structured Neonix JSON V2 document with layers, groups and timing, plus a visual editor for people who don't write code |
| Export | Renders through HeyGen's cloud API, billed per minute ($0.10–$0.30/min depending on resolution and frame rate), or self-hosted via your own Vercel, Cloudflare, Modal or Lambda deployment | Renders through Neonix's own hosted cloud API from inside the same editor, billed per second of video — no separate deployment to manage |
See it in practice
This is a complete Neonix input.
Neonix compiles markup like this into named, independently editable layers — not a flattened frame.
<div class="card">
<h1>Make it move.</h1>
<p class="subtitle">Turn an idea into motion.</p>
</div>
<style>
.card { animation: pulse 2s ease-in-out infinite; }
.subtitle { color: #0f766e; }
</style>FAQ
Frequently asked questions.
What is Neonix?
Neonix is an HTML-to-motion-video compiler that turns HTML and CSS into a real, exportable video.
How do AI agents use Neonix?
AI agents such as Claude connect to Neonix's Remote MCP server and call tools like create_project_html to compile HTML/CSS into a video project, then export it as MP4.
What makes Neonix different from template-based AI video tools?
Neonix compiles arbitrary HTML/CSS into a canonical protocol document and renders it deterministically — it does not fill in a fixed template.
Can Neonix convert HTML/CSS to MP4?
Yes. Neonix compiles HTML/CSS into Neonix Protocol V2, then exports MP4 through its native render pipeline.
How does Neonix's pipeline work?
Neonix compiles HTML/CSS into Neonix Protocol V2 (JSON), which you can preview and edit in the Neonix editor, then export to a real MP4.
How is Neonix different from Remotion?
Remotion renders video by taking headless Chrome screenshots frame-by-frame and stitching them with ffmpeg, which means writing React components and managing your own AWS Lambda or Cloud Run deployment to render at scale. Neonix compiles plain HTML/CSS into an editable Neonix JSON V2 document and renders it through a native CPU/GPU pipeline with an explicit color space, then exports through a hosted cloud pipeline in one click — no code and no infrastructure required.