Repolode
vercel-labs

vercel-labs/fx0

Un agente de diseño de código abierto que crea una página web completa en un solo archivo HTML a partir de una descripción de texto y está basado en la biblioteca de agentes libfx.

Estrellas
121
Forks
24
Issues abiertos
2
Último commit
hace 8 horas

¿Qué es?

fx0 es un agente de diseño: describes una página en un chat y el agente la crea en un solo archivo HTML, con una vista previa en vivo y un historial de todas las versiones del diseño que puedes volver a abrir, copiar o descargar. Puedes empezar con uno de los diez estilos design.md o subir el tuyo, y elegir el modelo que se usará en cada chat.

fx0 también es una aplicación de referencia para libfx, la biblioteca de agentes en la que se basa. El ciclo del agente, la transmisión de respuestas, las llamadas a herramientas, los reintentos y las sesiones persistentes se gestionan con una sola llamada a createFxAgent(), y cada subagente se ejecuta mediante createFxEngine(). Los chats se conservan aunque una función falle a mitad de una respuesta, porque cada turno se guarda paso a paso y se reanuda en Vercel Queues.

El proyecto requiere Node.js 24, una aplicación Sign in with Vercel, una base de datos Neon Postgres y una base de datos Upstash Redis. Las páginas generadas se ejecutan en un iframe aislado, con las solicitudes de red bloqueadas mediante Content Security Policy.

Funciones clave

  • 01Genera una página completa en un solo archivo HTML a partir de una descripción de texto
  • 02Conserva todas las versiones del diseño para que puedas volver a abrirlas, copiarlas o descargarlas
  • 03Permite elegir el modelo, el nivel de razonamiento y el modo rápido para cada chat
  • 04Puede buscar en la web y obtener páginas como referencia
  • 05Reanuda un turno desde el último paso guardado si la función del servidor falla
  • 06Incluye diez estilos design.md o permite subir estilos personalizados

Casos de uso

  • Crear un prototipo de una landing page o página de marketing a partir de un brief escrito
  • Generar una maqueta HTML de un solo archivo para compartir o previsualizar
  • Estudiar cómo se estructura una aplicación con agentes basada en libfx

Inicio rápido

  1. 1

    Prueba la aplicación alojada en fx0.vercel.dev o clona el repositorio

  2. 2

    Instala Node.js 24 y configura una aplicación Sign in with Vercel, una base de datos Neon Postgres y una base de datos Upstash Redis

  3. 3

    Copia `.env.example` en `.env.local` y completa los valores

Antes de usarlo

  • Para ejecutarlo por tu cuenta necesitas Node.js 24 y tres servicios externos: Sign in with Vercel, Neon Postgres y Upstash Redis.
  • Durable turns depende de la infraestructura de Vercel (Workflow, Queues y AI Gateway), por lo que la configuración completa está vinculada a Vercel.

Temas

Preguntas frecuentes

¿Qué es fx0?
Un agente de diseño de código abierto que crea una página web completa en un solo archivo HTML a partir de una descripción de texto y está basado en la biblioteca de agentes libfx. fx0 es un agente de diseño: describes una página en un chat y el agente la crea en un solo archivo HTML, con una vista previa en vivo y un historial de todas las versiones del diseño que puedes volver a abrir, copiar o descargar. Puedes empezar con uno de los diez estilos design.md o subir el tuyo, y elegir el modelo que se usará en cada chat.
¿fx0 es gratuito? ¿Qué licencia tiene?
fx0 es open source bajo la licencia Apache-2.0. Revisa los términos de la licencia antes de usarlo en productos comerciales.
¿fx0 sigue mantenido?
Mantenimiento activo. El último commit de fx0 fue el 19 oct 2026.
¿Para qué puedo usar fx0?
Crear un prototipo de una landing page o página de marketing a partir de un brief escrito Generar una maqueta HTML de un solo archivo para compartir o previsualizar Estudiar cómo se estructura una aplicación con agentes basada en libfx
¿Cómo se instala fx0?
Prueba la aplicación alojada en fx0.vercel.dev o clona el repositorio Instala Node.js 24 y configura una aplicación Sign in with Vercel, una base de datos Neon Postgres y una base de datos Upstash Redis Copia `.env.example` en `.env.local` y completa los valores
¿Dónde consigo fx0?
El código fuente y las instrucciones de instalación están en GitHub: https://github.com/vercel-labs/fx0

Resumen generado por IA a partir del README del proyecto. Las estadísticas de GitHub se actualizan a diario.

Proyectos relacionados