Bravo MCP turns your Lovable, Pencil, Figma, or Bravo Studio project into a real React Native app. It plugs into Claude, Cursor, or ChatGPT — same plan, same chat.
Bravo doesn't just take a screenshot or ask you to re-explain your app. It connects directly to Lovable, Pencil, Figma, or your existing Bravo app — through MCP — and reads the real screens, structure, and data, exactly as they exist in the original tool. Then it rebuilds all of that as a React Native app you fully own. Complete apps, not prototypes: connect your existing backend, or one will be generated for you.
Lovable builds a web app — quick to test, but it can't be published to the App Store or Google Play, and it won't feel fully native. Bravo connects directly to Lovable, pulls in the complete design and backend, and converts it into a real, native React Native app — ready to publish to the stores. No manual rebuilding, no copy-paste.
Connect your pencil.dev file and Bravo turns your screen designs into a complete React Native app — plus a ready-to-use backend, built on Convex, set up for you.
Bravo MCP reads the screens, structure, and components in your Figma file and builds them into a complete React Native app — with a Convex backend generated for you.
Already built in Bravo Studio? Bravo imports the app and every API binding — the link between your screens and your data — so everything carries straight over into the new React Native build, ready to extend with new features.
Bravo MCP runs through Claude, ChatGPT, Cursor, or any MCP client using your existing AI plan. Prompts are deliberate and tightly scoped, so token usage stays low even on big projects — you never have to pay Bravo for AI usage.
Realtime in-app updates · Backend built by AI
Changes in the app database are immediately reflected on screen — and your data, auth, and storage are already wired in.
Keep using the Bravo tagging system in your design tool to describe behaviour. The MCP server reads your tagged frames and turns them into a real React Native + Convex app — no handoff doc, no rewrite.
Bravo exports a clean React Native codebase you fully own. Push it to GitHub, hand it to a developer, take it anywhere.
What Bravo Studio (3.x) gives you today versus what Bravo MCP unlocks in 4.0. The two sit alongside each other — Studio doesn't go away.
Use the Bravo tagging system to describe what each frame becomes — screen, list, form, action. Same tags you'd use in Bravo Studio.
Open Claude, Cursor, or ChatGPT. Ask it to build the app from your design file. Bravo MCP introduces itself as a tool the model can call.
The server reads your tagged frames, calls bravo.generate, and produces a real React Native build with a Convex backend wired in.
import { View, Text } from 'react-native';
import { useQuery } from 'convex/react';
import { api } from '../convex/_generated/api';
export default function Home() {
const habits = useQuery(api.habits.list);
return (
<View>
{habits?.map(h => <Text>{h.name}</Text>)}
</View>
);
}Signed iOS + Android binaries straight to the stores. React Native source — yours to keep, yours to grow. Iterate the design in your tool, ship the update from the same MCP chat.
The MCP server URL is the same across every client: https://mcp.bravostudio.ai/mcp. When prompted, authenticate via OAuth using the Figma account connected to your Bravo account.
Bravo MCP has been tested most heavily with Claude. It works in any MCP-compatible client; the tabs below cover the common ones.
Read the full setup & usage guideGo to Settings → Connectors → Add custom connector, paste the URL above, and click Add. Claude opens an OAuth window — sign in with Figma and approve access. Works in Claude web and Claude Desktop.