Repolode
vercel-labs

vercel-labs/fx0

An open-source design agent that writes a whole web page as one HTML file from a text description, built on the libfx agent library.

Stars
121
Forks
24
Open issues
2
Last commit
9 hours ago

What is it?

fx0 is a design agent: you describe a page in a chat and the agent writes it as a single HTML file, with a live preview and a history of every design version you can reopen, copy or download. Users can start from one of ten design.md styles or upload their own, and pick the model used for each chat.

fx0 is also a reference app for libfx, the agent library it is built on. The agent loop, streaming, tool calls, retries and durable sessions come from a single createFxAgent() call, and each subagent runs through createFxEngine(). Chats survive a function crashing mid-reply, because each turn is saved step by step and resumed on Vercel Queues.

The project needs Node.js 24, a Sign in with Vercel app, a Neon Postgres database and an Upstash Redis database. Generated pages run in a sandboxed iframe with network requests blocked by Content Security Policy.

Key features

  • 01Generates a complete page as one HTML file from a text description
  • 02Keeps every design version so you can reopen, copy or download it
  • 03Lets you pick the model, reasoning effort and fast mode for each chat
  • 04Can search the web and fetch pages for reference
  • 05Resumes a turn from its last saved step if the server function crashes
  • 06Supports ten built-in design.md styles or custom uploads

Use cases

  • Prototyping a landing page or marketing page from a written brief
  • Generating a single-file HTML mockup to share or preview
  • Studying how an agent app is structured on top of libfx

Quick start

  1. 1

    Try the hosted app at fx0.vercel.dev, or clone the repository

  2. 2

    Install Node.js 24 and set up a Sign in with Vercel app, a Neon Postgres database and an Upstash Redis database

  3. 3

    Copy .env.example to .env.local and fill it in

Things to know

  • Running it yourself requires Node.js 24 plus three external services: Sign in with Vercel, Neon Postgres and Upstash Redis.
  • Durable turns rely on Vercel infrastructure (Workflow, Queues and AI Gateway), so the full setup is tied to Vercel.

Topics

FAQ

What is fx0?
An open-source design agent that writes a whole web page as one HTML file from a text description, built on the libfx agent library. fx0 is a design agent: you describe a page in a chat and the agent writes it as a single HTML file, with a live preview and a history of every design version you can reopen, copy or download. Users can start from one of ten design.md styles or upload their own, and pick the model used for each chat.
Is fx0 free to use? What license does it have?
fx0 is open source under the Apache-2.0 license. Check the license terms before using it in commercial products.
Is fx0 still maintained?
Actively maintained. The last commit to fx0 was on Oct 19, 2026.
What can I use fx0 for?
Prototyping a landing page or marketing page from a written brief Generating a single-file HTML mockup to share or preview Studying how an agent app is structured on top of libfx
How do I install fx0?
Try the hosted app at fx0.vercel.dev, or clone the repository Install Node.js 24 and set up a Sign in with Vercel app, a Neon Postgres database and an Upstash Redis database Copy .env.example to .env.local and fill it in
Where can I get fx0?
The source code and installation instructions are on GitHub: https://github.com/vercel-labs/fx0

Summary generated by AI from the project's README. GitHub stats refresh daily.

Related projects