Get Started
in Minutes
Start optimizing your AI-web interactions today. Choose your installation method and begin saving 67.6% on token costs.
1
Install webMCP
Choose your preferred installation method
2
Parse HTML
Extract interactive elements from web pages
3
Optimize for AI
Reduce token usage by 67.6% on average
4
Integrate & Deploy
Use in your automation workflows
Choose Your Installation Method
webMCP supports multiple platforms and languages. Pick the one that fits your workflow.
Installation
npm install @webmcp/corenpm install -g @webmcp/cliQuick Usage Example
import { WebMCPProcessor } from '@webmcp/core';
const processor = new WebMCPProcessor();
const result = processor.parseWebMCP(htmlContent);
const optimized = processor.optimizeForAI(result.elements, {
target_model: 'gpt-4o',
compression_level: 'basic'
});
console.log(`Token savings: ${optimized.token_savings}%`);Installation
pip install webmcp-corepip install webmcp-cliQuick Usage Example
from webmcp_core import WebMCPProcessor
processor = WebMCPProcessor()
result = processor.parse_webmcp(html_content)
optimized = processor.optimize_for_ai(result.elements)
print(f"Token savings: {optimized.token_savings}%")Installation
Visit Chrome Web StoreClick "Add to Chrome"Quick Usage Example
// Extension automatically detects webMCP elements
// No code required - just click the icon!
// API usage (optional):
chrome.runtime.sendMessage('webmcp-extension-id', {
action: 'scanPage',
options: { includeHidden: true }
});Installation
npm install @webmcp/reactnpm install @webmcp/coreQuick Usage Example
import { WebMCPForm, WebMCPInput, WebMCPButton } from '@webmcp/react';
function ContactForm() {
return (
<WebMCPForm goalDescription="Collect contact information">
<WebMCPInput name="name" aiSuggestions={true} />
<WebMCPInput name="email" type="email" aiSuggestions={true} />
<WebMCPButton type="submit">Submit</WebMCPButton>
</WebMCPForm>
);
}Installation
Download from WordPress.org (coming soon)Upload to /wp-content/plugins/Quick Usage Example
<?php
// WordPress form optimization
add_action('wp_ajax_webmcp_optimize', 'webmcp_optimize_handler');
function webmcp_optimize_handler() {
$processor = new WebMCP_Processor();
$result = $processor->optimize_form_data($_POST['form_data']);
wp_send_json_success($result);
}What's Next?
Explore more features and learn how to get the most out of webMCP
Read the Docs
Comprehensive guides, API reference, and tutorials to help you master webMCP
View DocumentationExplore Examples
Real-world examples and sample code for common use cases and integrations
Browse ExamplesNeed Help Getting Started?
Our community and support team are here to help you succeed with webMCP
📚 Comprehensive documentation
💬 Active Discord community
🎥 Video tutorials
📧 Email support