OwlLayer AI is live: make your web interface operable by an agent, without rebuilding it

Today we are officially opening OwlLayer AI to the public.

Agents are getting good at reasoning. Products, on the other hand, give them very little to act on. Two ways of putting AI into a web application have become the norm, and neither makes the agent truly useful:

• The bolted-on chatbot answers and advises, then leaves the user to do everything by hand. It describes the product; it does not use it.
• Browser automation hunts for buttons in the DOM, clicks, waits and guesses. It breaks at the first label change and bypasses your permissions and business logic.

OwlLayer AI takes a third path: your application declares what it agrees to do, and the agent acts only through those entry points. No scraping, no generated replacement UI. Your components, business rules and workflows stay the source of truth.

What happens when the user speaks

A user says: "Add two headsets to my cart and place the order", typed or spoken.

1. The interface publishes its current context and the actions available on the screen.
2. The agent picks a typed action, for example add_to_cart, with its arguments.
3. The client checks those arguments against the action's schema. If they are invalid, the agent gets the error and fixes its call: nobody was interrupted.
4. The risk policy applies. add_to_cart runs; confirm_order stops and asks for your approval.
5. Your code performs the action, in your handlers, with your permissions and transactions.
6. The agent receives a structured result and answers the user.

The agent never clicks. It asks. Your application decides.

Declare an action in ten lines

useAgentTool(  {    name: 'add_to_cart',    description: 'Add the current product to the cart',    schema: z.object({ quantity: z.number().int().min(1) }),    risk: 'low',  },  async ({ quantity }) => {    await cart.add(product, quantity);    return { productId: product.id, quantity };  },);

The hook lives in the component that owns the action, next to the state it needs. When the component goes away, the action goes with it.

Five concepts, one runtime

OwlLayer AI rests on five building blocks, documented on the Concepts page.

Neural-DOM Binding. The explicit link between the live page and the model. The model reasons; execution stays in your code. The agent's action surface follows your component tree: navigating changes what it can do, with no global list to maintain.

Tools. A tool is a business action: a name, a description the model reads, an argument schema, a risk level and a handler. Three parts of the runtime manage them. Registration adds the tool to the client registry when the component mounts and tells the server. Unregistration removes it when the component unmounts, except for tools declared global. The executor receives each call, validates the arguments, applies the risk policy, waits for your handler and returns the result. The client and the server share the same registry: the same rules on both sides, and a limit of active tools per session (30 by default) that you set on the server.

Shadow Context. The useful state of the screen that you choose to publish: page, displayed product, number of items in the cart. The raw DOM is never sent to the model. The agent knows where the user is without seeing more than you show.

HITL execution. Every tool carries a risk level enforced before anything runs:

In React and plain HTML, the approval dialog renders in a closed Shadow DOM: the page's CSS cannot hide it. The server can also block a tool even if the client declares it.

AITP. The Agent-to-Interface Transfer Protocol is a typed JSON protocol with 14 messages. It synchronizes context, tools, calls, approvals, results and audio between the interface and the server, over WebSocket or WebRTC. Text and voice share the same execution contract.

What is available today

• SDKs for React, Vue, Svelte, Angular and plain HTML, including server-rendered pages. Hooks, composables, actions, directives or data-owllayer-tool attributes: each follows its framework's lifecycle.
• A server runtime with OpenAI, Google Gemini and Anthropic Claude adapters, real-time voice with OpenAI Realtime and Gemini Live, and LiveKit voice rooms.
• Deepgram for voice, in three modes: batch speech-to-text and text-to-speech (Nova, Aura-2), turn-aware streaming (Flux), and realtime with the Deepgram Voice Agent. Tools, approvals and the conversation stay with OwlLayer AI.
• A ready-made chat widget, or your own interface: the contract stays the same.
• An embedded dashboard and DevTools to inspect sessions and active tools, and to simulate calls.
• Runnable demos: a React store, a Vue back office, a Svelte travel planner, an Angular marketplace and a plain HTML store.
• Shopify and WooCommerce integrations, experimental.

The project is MIT licensed and at 0.x: APIs may still change, so pin your versions.

Who is it for?

For teams who want an agent that acts in their product while keeping every action safe, bounded and traceable: guided commerce, business dashboards, support flows, voice experiences. Anywhere the agent must be useful without becoming an automation layer nobody controls.

Get started

• Follow the quick start: one server, one component, a first tool.
• Read our step-by-step guide: make a React store operable by an agent.
• Browse the repository and run the demos.
• Tell us what you are building in GitHub Discussions. Contributions are welcome.

Your interface already exists. It is time to make it agentic.