https://github.com/sdras/webmcp-demo
Teaching people about WebMCP
https://github.com/sdras/webmcp-demo
agents chrome webmcp
Last synced: 8 days ago
JSON representation
Teaching people about WebMCP
- Host: GitHub
- URL: https://github.com/sdras/webmcp-demo
- Owner: sdras
- License: mit
- Created: 2026-05-17T00:32:16.000Z (18 days ago)
- Default Branch: main
- Last Pushed: 2026-05-22T22:37:37.000Z (12 days ago)
- Last Synced: 2026-05-23T00:24:33.820Z (12 days ago)
- Topics: agents, chrome, webmcp
- Language: CSS
- Homepage: https://webmcp-demo-sdras.netlify.app
- Size: 184 KB
- Stars: 14
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# WebMCP Demo
A mini-site that's a WebMCP explainer!
This shows a side-by-side demo of how AI agents interact with a web page today (scraping the DOM / accessibility tree) versus a future where the page declares structured tools via **WebMCP**. It shows:
- A calendar button side by side as a demo, but on the right side, you can play with it with the webMCP extension.
- An explainer of how WebMCP works, and many links and docs
- Calls to action linking to the spec and feedback channels.
You can feel free to fork this demo as a learning tool, and you're also encouraged to follow the links on the site for further resources to build your own sites, apps and experiences, or participate in the origin trial.
## Running locally
This is a single static page — no build step.
```sh
# any static server works; pick one
npx serve .
# or
python3 -m http.server 8000
```
Open the served URL in a browser.
## Files
- `index.html` — page structure and copy
- `styles.css` — visual design
- `app.js` — booking widget, WebMCP shim, agent simulation, annotation layout