automation

overlay-web

Name: overlay-web
Author: LayerNorm

The all-in-one platform for humans and agents to get work done

184 stars23 forksTypeScriptUpdated 10/21/2026100% free · open source

What it does

Overlay‑Web is a TypeScript‑based platform that lets you build and run interactive UI overlays where human users and AI agents can collaborate on tasks in a single web app.

When to use it

•You need a shared workspace where a human can hand‑off subtasks to an AI agent (e.g., drafting copy, data extraction) without leaving the page.
•You want to prototype a custom UI that mixes chat‑style AI prompts with real‑time form inputs and visual feedback.
•Your product requires a low‑code “agent‑assist” layer that can be embedded in any existing web front‑end.

Ready-to-paste prompt

In the overlay UI, type:

```
Create a 3‑step onboarding checklist for new SaaS users, each step with a checkbox and a brief description.
```
The agent will generate a markdown list that renders instantly as interactive checkboxes you can tick off.

Heads up: Overlay‑Web relies on a valid OpenAI API key at runtime; if `OPENAI_API_KEY` is missing or invalid, the server will start but any agent call will fail with a 401 error.

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🔑 Needs an API key

Works after you add credentials — the setup agent will ask you for them.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/overlay-web && curl -fsSL https://workflowstacks.com/api/skills/overlay-web/claude-skill -o ~/.claude/skills/overlay-web/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

What's inside — free to inspect

No purchase needed

Read the entire source before you build — unlike paid marketplaces that hide it behind a buy button.

top-level files

folders

279.8M

source size

AGPL-3.0

license

Key files

AGENTS.md

doctor.config.json

eslint.config.mjs

next.config.ts

package.json

postcss.config.mjs

File tree

.githooks/

.github/

apps/

benchmarks/

config/

convex/

deploy/

docker/

docs/

examples/

infra/

internal/

packages/

public/

scripts/

src/

tests/

.dockerignore

.env.better-auth.local.example

.env.enterprise.example

.env.example

.env.onprem.example

.gitattributes

.gitignore

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🔑 Needs an API key

Works after you add credentials — the setup agent will ask you for them.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/overlay-web && curl -fsSL https://workflowstacks.com/api/skills/overlay-web/claude-skill -o ~/.claude/skills/overlay-web/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

LayerNorm

Language

TypeScript