Now available: MCP Studio SDK Free and SDK Pro plans with optional analytics dashboard subscriptions.

Developer Portal

Build absolutely anything...with the right contextinside your own app

Add a no-code MCP server builder directly to your product. Your users can connect trusted sources, deploy MCP endpoints, and measure context usage while you control branding, tools, source types, analytics, and layout.

index.html
<!-- MCP Studio SDK -->
<div id="mcp-studio-widget"></div>
<script src="https://appatools.com/mcp-studio-sdk/embed.js"></script>
<script>
  MCPStudio.init({
    clientId: "mcps_live_a91f...",
    container: "#mcp-studio-widget",
    layout: "vertical",
    sources: {
      pdf: false
    },
    analytics: {
      enabled: true,
      tier: "action"
    }
  });
</script>

Plans & Limits

Free plan allows testing with 1 MCP server and no dashboard access. SDK Pro supports up to 10 MCP servers and 5,000 MCP requests/month, with optional analytics dashboard subscriptions per server.

Each MCP server has a cumulative allowance of indexed chunks shared across its sources — up to 500K on Free and up to 3M on SDK Pro, so your end users can index bigger documentation sites and monorepos in full.

1

Free plan MCP server

5,000

SDK Pro MCP requests/month

10

SDK Pro servers included

Capabilities

Everything you need to embed context workflows

Give users a guided path from trusted sources to a live MCP endpoint, with controls that match your product.

One snippet embed

Add MCP Studio to your app with one code snippet. Your users get a no-code wizard to create context-backed MCP servers.

Tool configuration

Choose exactly which tools your users can access — search, code extraction, API reference, and more.

Source control

Control which source types are available: websites, GitHub repos, documentation sites, APIs, PDFs, or MCP servers.

Custom branding

Match your brand with customizable colors for every component — background, buttons, cards, and steppers.

Layout options

Horizontal or vertical wizard steps. Choose the layout that fits best within your application.

Live preview

See configuration changes reflected in the embed snippet before you ship the experience to users.

Learn by example

Demo apps and SDK playground

Learn by example with three public sample apps plus an interactive playground where you can edit configuration JSON and see changes applied instantly.

Public sample app repo

HelpDesk IQ, PolicyPilot, and KnowledgeCloud LMS as simple fullstack Next.js concepts.

Live playground

Start from a default HelpDesk IQ-style config, edit code, save, and see a live demo app update on the left panel.

Integration

How it works

1

Sign in

Authenticate with GitHub or Google to create your developer account.

Get started
2

Get credentials

Receive your Client ID and Client Secret for SDK authentication.

Credentials guide
3

Configure context

Choose the tools, source types, analytics, colors, layout, and fonts for your users.

Configuration docs
4

Embed

Copy the generated snippet into your app so users can create MCP servers from trusted sources.

Embed guide

Ready to embed MCP Studio SDK?

Sign in to get credentials, configure the user experience, and let your users build MCP servers from the right context.