Browser-first WebMCP demo
A page that exposes tools, prompts, and resources directly to an AI agent.
Kartikay Dhar built this public WebMCP demo so an AI browser or the MCP-B extension can discover what the page offers, read canonical resources, and change the canvas without a hidden chatbot backend. The tools, prompts, and resources stay on the page. An agent can list recent writing, open a project, and highlight a milestone while a person watches the same page update.
Checking
Checking browser support for navigator.modelContext.
8 tools
Three core content tools plus five safe, visible demo actions.
4 prompts
Ready-made prompts that showcase discovery, reading, and page manipulation.
WebMCP chat surface
When configured, this page can render a real on-page WebMCP chat client. Otherwise, use the manifest, setup steps, and extension/browser flows to exercise the same page-local tools.
Embedded WebMCP chat is not configured yet.
The page-level WebMCP tools, prompts, and resources still work with an AI browser or the MCP-B extension. To also render an on-page embedded chat client, configure either production agent settings or development mode keys:
NEXT_PUBLIC_WEBMCP_APP_IDandNEXT_PUBLIC_WEBMCP_API_BASEfor the production embedded-agent path- or
NEXT_PUBLIC_WEBMCP_ANTHROPIC_API_KEYfor dev mode chat
Plain Chrome plus the extension is enough for page tool discovery, but an on-page chatbot still needs the embedded-agent runtime configured.
Suggested prompts
Open the most recent blog post and tell me why it matters.
Find the strongest AI project and focus the work canvas on it.
Show the resume sections that matter most for product engineering leadership.
Prepare a hiring outreach message without sending it.
If your browser does not expose
navigator.modelContext, this page still shows the manifest and the canvas, but the page-local WebMCP actions will not activate until you use an AI-capable browser or the MCP-B extension.Blog spotlight
The canvas reacts when an agent calls
portfolio_open_recent_blog.blog://posts/kiro-crew-async-agent-workspace
What Amazon Kiro Crew Means for Async Agents
Kiro Crew is AWS Kiro's open-source async agent workspace: schedules, memory, approvals, and audit logs so coding agents keep working after you leave.
Open blog post
AI & LLM
Project canvas
Project cards narrow and reorder when the agent uses
portfolio_filter_projects.Query
No filter applied
Open Source
The Era of Context-Aware Prototyping
Stop recreating, start creating.
SkillsClaude codeReact
Platform
Sprouts Data Intelligence (MCP)
MCP access to 350M+ contacts and 35M+ accounts on Claude & OpenAI
TypeScriptOAuthMCP
0→1 Launch
AI powered Data Intelligence on Agentforce
AI powered Agentforce app on Salesforce enabling access to 350M+ contacts and 35M+ accounts
SalesforceApexLWCAI
Resume focus
The active section changes when the agent uses
portfolio_focus_resume_section.Experience
Education
Skills
Certifications
Summary
Full Resume
resume://section/summary
Summary
- From 0→1 and 1→n: I build AI products that scale—from first prototype to enterprise revenue. Deep in LLM-powered systems, agent frameworks, vector databases, and workflow automation.
- 12+ years shipping across the full stack: QA → Engineering → Solution Architecture → Product Leadership
Director of Product, AI · Bengaluru, India
Achievement highlight
The highlighted card changes when the agent uses
portfolio_highlight_achievement.Leadership
Years of Experience
12+
Technical
Records Processed
450M+
Business Impact
ARR Growth
4×
Product
Cost Reduced
50%
Safe public actions
The agent can prefill these fields, but it cannot submit them from this public demo page.
Newsletter draft
This is intentionally safe. The public demo only uses
portfolio_prepare_contact_form and portfolio_prepare_newsletter_signup. No message is sent and no subscription is created until a human explicitly uses the normal site flow.Registered on this page
The manifest is intentionally compact so tool selection stays clear for agents.
Tools
search_content
Search Kartikay's website content across blog posts, projects, resume, about, and achievements. Returns MCP-style resource URIs you can read next.
list_recent_content
List Kartikay's latest published content and return MCP-style resource URIs for recent blog posts or projects.
read_resource
Read a canonical site resource by URI. Supported examples: blog://posts/some-slug, project://items/some-slug, resume://section/summary, about://profile, achievements://timeline.
portfolio_open_recent_blog
Open the most recent blog post in the demo canvas and return its canonical URI and site path.
portfolio_filter_projects
Filter the visible project grid in the demo canvas by a natural-language query.
portfolio_focus_resume_section
Focus the demo canvas on a specific resume section and return the matching canonical resource URI.
portfolio_highlight_achievement
Highlight the most relevant achievement card in the demo canvas for a given query.
portfolio_prepare_contact_form
Prefill the demo contact form without sending it. Safe for public demos.
portfolio_prepare_newsletter_signup
Prefill the demo newsletter signup field without submitting it.
Resources
about://profile
Kartikay Dhar's profile, background, and current focus.
achievements://timeline
Awards, milestones, and recognitions.
resume://section/summary
High-level professional summary and key stats.
resume://section/all
Combined resume content across all sections.
blog://posts/{slug}
Read a published blog post by slug.
project://items/{slug}
Read a published project by slug.
resume://section/{section}
Read a specific resume section such as experience, education, skills, certifications, summary, or all.
demo://capabilities
Describes the visible WebMCP demo surface, its safe actions, and the recommended prompts to try.
Prompts
site-tour
Guide an agent through the public WebMCP demo and its visible UI surface.
find-best-project
Find the strongest AI or product project and focus the visible project canvas on it.
summarize-hire-signals
Read the resume resources and highlight the strongest hiring signals in the visible canvas.
open-latest-writing
Open the most recent blog post in the visible demo canvas and summarize it.
Agent activity
Every prompt, tool, and resource event on this page is logged here.
Waiting for browser support or the first agent interaction.