This new browser-based AI agent can actually redesign its own UI
Most AI agents today can write code, update markdown files, or call tools—but they’re stuck inside a fixed interface. Space Agent flips that model. It runs directly in your browser, can rewrite the page you’re looking at, and effectively designs its own UI around whatever task you give it.
What is Space Agent?
Space Agent is an open-source, browser-based AI agent framework that runs on the client side in JavaScript. Instead of living on a remote server and talking to you through a rigid interface like WhatsApp, Telegram, or a static web chat, it executes code directly in your browser and can mutate the UI in real time.
This means the agent doesn’t just answer in text. It can create widgets, dashboards, tools, and even mini-apps on demand—then keep improving them as you work.
Why running the agent in the browser matters
Most existing agents run on a VPS or server and talk to you over a thin UI layer. They might be powerful on the backend, but they’re constrained by whatever interface they’re plugged into. For example, inside WhatsApp they can only send messages or images. Even in a web UI, they usually can’t rewire the interface itself without manual refreshes or backend changes.
Space Agent takes a different approach: the agent runs in the browser’s JavaScript runtime. That gives it direct control over the page you’re looking at. It can:
• Create new UI components on the fly
• Resize, move, and rearrange widgets
• Build complex dashboards that span an effectively infinite grid
• Keep everything persistent across reloads
Because the heavy lifting happens on the client side, the backend can stay very thin—mainly handling user accounts, permissions, and file storage. This also makes the demo server extremely lightweight, even with many users online.
Spaces and widgets: how the UI is built
The core concept in Space Agent is the “space.” A space is like a canvas or workspace where the agent can place and manage widgets. Widgets are self-contained UI components: charts, notes editors, dashboards, games, research panels, and more.
Within a space you can:
• Add multiple widgets
• Resize and move them freely
• Let the agent rearrange or expand the layout automatically
• Persist the entire configuration as text on disk
Crucially, the agent doesn’t just edit the DOM directly and hope it sticks. Instead, it writes functions that generate widgets. Those functions are stored and can be re-run at any time, so when you refresh the page or reopen the app, your space is recreated exactly as it was.
Self-updating UI: a new agent paradigm
Most “self-improving” agents today can update their own skills, tools, or markdown files. But they can’t really design and ship new interfaces for themselves without a human developer in the loop.
Space Agent changes that. Because it can execute JavaScript in the browser, it can:
• Add new buttons, controls, and panels
• Wire those controls back into the agent itself
• Extend existing widgets with new features
• Build entirely new mini-apps inside a space
For example, you can ask it to:
• Show the weather in a widget instead of just text
• Turn a simple research workflow into a full research dashboard
• Add an “Export to PDF” button to a report view it just created
The agent responds by generating the necessary JavaScript, updating the UI, and wiring everything together—without you touching code.
Token-efficient JavaScript execution
Under the hood, Space Agent uses a very simple but powerful pattern for tool use. The model first generates a plain-text answer. If it needs to run code, it appends a special token followed by raw JavaScript. Everything after that token is executed automatically in the browser.
This has a few big advantages:
• No JSON tool schemas or escaping overhead
• No extra wrapper fields in responses
• Extremely low token usage for tool calls
In practice, a full weather lookup plus widget generation can cost only a few hundred tokens. In an era where top models like Claude Opus or GPT 5.5 Pro are expensive per million output tokens, this kind of “tokonomics” matters. You can run cutting-edge models while keeping costs under control.
Keeping context cheap with transient sections
Another design choice is how Space Agent handles long context. UI state like page transcriptions or widget source code can easily blow up your token usage if it’s kept in the conversation history forever.
To avoid that, Space Agent uses a transient section at the end of the prompt. Frequently changing data—like the current page transcription or the latest widget code—is placed there. It’s visible to the model on each turn, but it isn’t cached or accumulated in the long-term history.
This means:
• You don’t pay repeatedly for large chunks of state
• You preserve caching for the stable parts of the prompt
• You can keep long-running sessions without context bloat
Real examples: from notes apps to surveillance dashboards
Because the agent can design its own UI, it’s surprisingly fast to build useful tools from scratch just by talking to it. Some examples built in minutes:
Notes app
Space Agent created a full-featured notes application with:
• Folders and renaming
• Visual editing and markdown view
• Copy-paste, images, and attachments
The entire thing runs in a space, and the data can stay local if you use the native app or self-hosted backend.
Surveillance dashboard
By providing URLs to public IP cameras, the agent built a multi-camera surveillance dashboard. Each feed is a widget; the layout is fully adjustable. The same pattern would work for home cameras or other monitoring setups.
Agent orchestration hub
Space Agent can also orchestrate other agents. In one setup, it connected to an Agent Zero instance via API and created:
• A custom chat interface that relays messages to Agent Zero
• An embedded browser window showing the full Agent Zero web UI
• Controls to let the agent drive that embedded browser
This makes Space Agent a powerful control panel for other systems and agents—similar in spirit to how some developers use browser automation stacks like Claude Code plus Playwright to turn their browser into an agent, but with a fully dynamic UI layer.
How the browser control works
Space Agent is also surprisingly good at controlling browsers. Instead of exposing raw HTML, it transcribes pages into a simplified, token-efficient representation. Every interactive element—buttons, inputs, sliders—gets a reference number and a short description. Text stays as text.
The agent sees something like:
• “Button 51: Cancel (red, error style)”
• “Input 12: Search field”
To act, it just sends commands like “click button 25” or “type into input 12.” After each action, it receives a fresh transcription of what changed.
Because this representation is compact (often just a few dozen tokens per action), the agent can navigate complex UIs quickly and cheaply. The team had to solve tricky web-crawling problems—iframes, shadow DOMs, cross-origin restrictions—but the end result is a robust, fast browser control layer.
Research workflows and custom tools on demand
One of the more advanced demos is a research harness space. The agent built:
• A research input widget for the topic and instructions
• A research output widget with sections like planning, sources, notes, and summary
• A feedback loop where the UI can send messages back into the agent
When you click “Start research,” the UI sends a structured request to the agent. The agent then:
• Plans the research
• Uses the browser to visit relevant sites
• Updates the research template step by step
• Writes a markdown file with the final report
Later, you can ask it to enhance the UI—for example, by adding an “Export to PDF” button and richer formatting. The agent modifies the widget code accordingly, and the new feature just appears.
Building complex UIs by chatting: Kanban boards, charts, and games
Because everything is driven by natural language, you can rapidly prototype very different interfaces in a single space:
Kanban board
Ask for a Trello-style, colorful Kanban board and the agent will generate a multi-column board with draggable cards, renaming, and extensible structure.
Stock price charts
Ask for a stock chart for NVIDIA, Apple, and Alphabet and it will pull data (for example from Yahoo Finance) and render a live chart, all from the browser—benefiting from the fact that requests come from your machine, not a data-center IP that might be blocked.
Games and creative tools
Space Agent can even build simple games like Snake or creative tools like a step sequencer with instruments, knobs, and a guitar-style free-play area. In one session, a full sequencer plus controls and a basic “piano roll” view were built in under half an hour.
Limitations: what Space Agent is not for (yet)
Despite its flexibility, Space Agent isn’t the right tool for every job. It’s not designed for:
• Low-level OS tasks like installing Linux packages
• Running background jobs when your browser or machine is off
• Hosting long-running backend servers or services
For those use cases, a backend-focused agent like Agent Zero is a better fit. Space Agent shines when you need rich, dynamic, user-facing workflows that live in the browser.
Local-first, multi-user, and privacy options
Space Agent’s architecture is built around flexibility in how and where you run it:
• Demo site: A hosted demo where you can try it instantly. It’s not meant for long-term storage; files may be wiped at any time.
• Native app: A bundled Electron-style app that includes both frontend and backend. Everything runs locally on your machine; no data is sent to the project’s servers.
• Self-hosted backend: Run the Node.js backend on your own machine or VPS and connect via browser. This supports multiple users, groups, permissions, and shared spaces.
In all cases, user and group directories are tracked as separate git repositories. That enables one of Space Agent’s most unique features: time travel.
Time travel and admin mode: safety nets for self-modifying agents
Letting an AI freely edit its own environment is powerful—but risky. Space Agent addresses this with built-in versioning and recovery tools.
Time travel
Every user and group directory is a git repo. Any change—new spaces, updated widgets, settings tweaks—is automatically committed. You can:
• Jump back to how things looked two hours ago
• Step through individual changes and revert them
• Move forward again to the present state
If the agent breaks something in your workspace, you don’t need another agent to debug it. You just roll back.
Admin mode
If the main UI becomes completely unusable (for example, the agent corrupts critical rendering code), you can always open Space Agent in admin mode. This loads a persistent, firmware-like admin interface on the left and the broken UI on the right.
From admin mode you can:
• Use the agent to repair the framework
• Browse and edit files directly
• Use time travel to revert to a safe state
• Manage installed modules
Because the admin UI is static and not editable by the agent, it acts as a reliable escape hatch.
Under the hood: modules, prompts, and AI-assisted development
Space Agent itself was built almost entirely with AI coding tools. The core idea was to create a modular system where:
• Features like file browsing, local inference, or specific widgets are separate modules
• Modules can be developed per user, per group, or globally
• The agent can generate new modules on the fly
A key part of making this work was documentation. Every meaningful part of the codebase has an agents.mmd file: a markdown document describing how that module works, why it’s designed that way, and what not to do when changing it.
This documentation-first approach is optimized for AI agents, not just humans. Before modifying a module, the coding agent reads its agents.mmd file to understand the constraints. That dramatically reduces repeated mistakes and conflicting changes—an approach any team building AI-first software could adopt.
The system prompt that drives Space Agent’s behavior was also auto-optimized. An automated research loop generated new prompt variants (conservative, medium, and wild), tested them with harnesses, added new test cases for failures, and iterated through hundreds of versions to improve reliability and token efficiency.
Models, costs, and local inference
Space Agent is model-agnostic. You configure your own LLM provider and API key. The default recommendation is OpenRouter, which gives you access to models from OpenAI, Anthropic, Google, and others under one billing system.
In practice, the team has used models like:
• Claude Opus and Sonnet for high-reliability UI coding
• GPT 5.4 mini for very fast iteration (with less reliability)
• Gemma 4, which performed surprisingly well in evals and can run locally
There’s also a built-in panel for local inference using NNX-format models from Hugging Face. You can download a model like Gemma 4 (assuming you have a strong enough GPU), load it into memory, and run Space Agent entirely on your own hardware.
Because agentic systems are complex, you generally want a capable model to interpret the system prompt and write JavaScript reliably. Ultra-cheap “mini” or “flash” models may struggle with the complexity of self-modifying UIs.
How Space Agent compares to backend agents like Agent Zero
Space Agent and Agent Zero come from the same team but target different layers of the stack:
• Agent Zero: A backend-focused, Docker-based agent that can install packages, run servers, and execute long-running jobs without user interaction. It’s designed to keep going until a task is done, without constantly asking questions.
• Space Agent: A browser-based, highly interactive agent that collaborates with the user. It’s ideal for tasks where you’re present to solve CAPTCHAs, log in to sites, or give feedback on UI changes, and where a dynamic interface is a big advantage.
In practice, many power users will likely run both: Agent Zero for heavy backend automation and Space Agent as a flexible, visual control surface and experimentation environment. For a broader overview of how different models fit into agent stacks, you may also find this guide to top AI models for agent roles helpful.
Getting started with Space Agent
Trying Space Agent is straightforward and doesn’t require any installation if you start with the hosted demo:
1. Go to the project website at space-agent.ai.
2. Create a temporary guest account in a couple of clicks.
3. Set your LLM API key (OpenRouter is the default suggestion).
4. You’ll land in your first space, where the agent is already instructed to show you something impressive.
From there, you can:
• Ask it to build a notes app, dashboard, or research tool
• Explore prebuilt example spaces like daily dashboards or games
• Download the native app if you want everything to stay local
• Check the GitHub repo for documentation, self-hosting guides, and the open-source codebase
Because spaces are cheap to create and stored as small text files, you can spin up hundreds of them—for work, experiments, or just playing with what a self-evolving UI agent can do.
Why this feels like a new OS layer
One of the more radical ideas behind Space Agent is that, in the long run, you might not need traditional apps for many tasks. Instead of opening a dedicated email client with fixed buttons and views, you could simply tell your agent:
“Check my email and show me a window with messages sorted by priority, with a panel for urgent replies.”
The agent could then draw exactly that interface, adjust it as your needs change, and tear it down when you’re done. No static apps, no hardcoded buttons—just a fluid UI layer that reshapes itself around your workflows.
Space Agent isn’t that full vision yet, but it’s a concrete step toward it: a browser-based AI that can design, build, and evolve its own interface in real time.
Comments
No comments yet. Be the first to share your thoughts!