The Model Context Protocol (MCP) is the missing wire between an AI coding tool and a real backend. Without it, your AI knows what JavaScript looks like but hallucinates your endpoints. With it, your AI knows your project’s brand context, your data shapes, your conventions — and uses real tools to make real changes.Documentation Index
Fetch the complete documentation index at: https://docs.neuraldraft.io/llms.txt
Use this file to discover all available pages before exploring further.
@neuraldraft/mcp is our open-source MCP server. Drop it into Claude Code,
Cursor, or Continue and your AI starts generating Neural Draft-native code
automatically. No reading the docs. No glue code.
Why this matters
Every AI codegen tool today (Lovable, Claude Code, Cursor, v0, Bolt) is great at generating frontends and bad at integrating with anything that isn’t on its training data. The output is usually a beautiful page that calls/api/some-endpoint-that-doesnt-exist.
MCP fixes that with three primitives. Resources, tools, and prompts — each
designed to give the AI just enough live context to be correct without
overwhelming the prompt:
- Resources are read-only context. The AI loads
brand://currentonce per session and now knows your colors, fonts, voice, and audience. - Tools are functions the AI can call. When it generates a hero section,
it calls
register_component(html, intent)— and the section appears in your admin as editable. - Prompts are slash commands the user can invoke.
/scaffold-marketing-sitedrops a complete, opinionated, Neural-Draft-native scaffold into the current project.
data-translate
attributes; every page reads brand colors automatically; every API call hits
the real Neural Draft endpoint instead of a hallucinated one.
What @neuraldraft/mcp exposes
Resources
| URI | What it is |
|---|---|
brand://current | Voice, audience, colors, fonts, industry. Read this before any UI gen. |
schema://blog-post | The shape of a blog post — drives the /blog page generation. |
schema://product | Product/variant shape — drives storefront pages. |
schema://booking | Service/booking/availability shape — drives booking widget integration. |
conventions://editable-html | The data-translate and data-image-key rules for editable sections. |
conventions://api-usage | REST patterns, auth headers, error shapes — so the AI calls things right. |
Tools
| Name | Purpose |
|---|---|
register_component | Register a generated HTML section as editable in the project admin. |
create_translation_keys | Bulk-create translation key namespaces matching the markup. |
generate_blog_post | Kick off the AI blog pipeline; returns a job id. |
generate_image | Brand-consistent image generation; returns a URL or job id. |
connect_social_account | Returns an OAuth URL for the AI to surface to the user. |
list_products / get_product | Read storefront state when generating product pages. |
setup_booking_widget | Returns the embed snippet for a service. |
Prompts (slash commands)
| Slash command | What it does |
|---|---|
/scaffold-marketing-site | Opinionated full-site scaffold using Neural Draft for everything. |
/scaffold-blog-page | Drop a blog index + post page into an existing project. |
/connect-existing-site | Point an existing static site at Neural Draft for editability. |
/add-booking-widget | Embed a service’s booking widget — pick the service, drop the code. |
How the magic works
When a user types “build a marketing hero” in Claude Code with Neural Draft’s MCP active, three things happen invisibly:- Context injection — the AI reads
brand://currentand now uses your actual colors and voice. It readsconventions://editable-htmland now knows every text element should bedata-translate="...". - Tool-driven registration — the AI generates the hero, then calls
register_component(html, intent). The component appears in your admin immediately, with thedata-translatekeys auto-discovered as editable fields. - Brand auto-application — the AI doesn’t need you to say “use our purple” or “match our voice” again. The brand resource is in context for every subsequent section.
Open source from day one
@neuraldraft/mcp is Apache-2.0 licensed and published on
npm. The package is a thin
wrapper around the v1 Project API — same key, same endpoints, same behaviour
as if you’d called REST directly. The companion TypeScript SDK is on GitHub
at vbalagovic/neuraldraft-sdk;
file MCP bugs there until the standalone repo lands. We maintain both because
they’re the most important onboarding assets in the platform.
What about Lovable, v0, Bolt?
These hosted codegen tools don’t yet support MCP — they’re closed-loop. For those environments, we ship a system-prompt block (frameworks/lovable) you paste into the build prompt. It teaches the model the same conventions the MCP server enforces. When Lovable/Bolt eventually ship MCP support, we’re already there — the server we ship today will work without changes.Next steps
Setup
Wire Claude Code, Cursor, or Continue in 60 seconds.
Tools and resources
The full surface area, with parameter shapes and example results.
Lovable / v0 / Bolt
The system-prompt block that gives non-MCP clients the same conventions.
Cursor template
A ready-made
.cursor/rules (or CLAUDE.md) for projects that don’t run MCP.