opointo

Official11 tools

by opointoHQ

Design a React Native app in a browser and emit it as a real Expo project you own, iOS and Android.

MCP Server: com.opointo/opointo

The MCP server com.opointo/opointo is described as a tool that helps “Design a React Native app in a browser” and “emit it as a real Expo project you own, iOS and Android.” The provided description focuses on generating an Expo-based React Native project suitable for both iOS and Android.

🛠️ Key Features

Browser-based design of a React Native app
Emits a real Expo project
Generated project targets iOS and Android

🚀 Use Cases

Creating a React Native app via a browser workflow
Generating an Expo project for iOS and Android development
Producing a project the user “owns” for further work

⚡ Developer Benefits

Start from a generated Expo project instead of a purely conceptual design
Consistent output for iOS and Android from the same source

⚠️ Limitations

No additional tools, configuration details, or topic metadata were provided in the source data.

Captured live from the server via tools/list.

find_component

Finds the component for a UI need described in plain words, ranked, and says when this catalog ships nothing on purpose because the phone's own control is the right choice. Omit `need` to list every component with its purpose and whether it renders the real system control.

Parameters2

need	string	optional	e.g. "a progress bar for an upload"
category	string	optional

Raw schema

{
  "type": "object",
  "properties": {
    "need": {
      "type": "string",
      "description": "e.g. \"a progress bar for an upload\""
    },
    "category": {
      "type": "string",
      "enum": [
        "controls",
        "chrome",
        "surfaces"
      ]
    }
  }
}

get_component

Everything needed to write a correct call site for one component: props with types, defaults and allowed values, what draws on iOS and on Android, the providers it needs at the app root, its dependencies, and the runtime rules that stop it rendering blank.

Parameters2

slug	string	required	e.g. "button"
platform	string	optional	only the rules that hold there

Raw schema

{
  "type": "object",
  "properties": {
    "slug": {
      "type": "string",
      "description": "e.g. \"button\""
    },
    "platform": {
      "type": "string",
      "enum": [
        "ios",
        "android"
      ],
      "description": "only the rules that hold there"
    }
  },
  "required": [
    "slug"
  ]
}

check_snippet

Scans TSX that uses these components for the mistakes that render nothing with no error: animated opacity on glass, the flex: 1 collapse, a clipped lens, a conditionally mounted surface. A read-only text scan, not a guarantee; verify_app checks a whole emitted project.

Parameters1

code

string

required

the TSX to check

Raw schema

{
  "type": "object",
  "properties": {
    "code": {
      "type": "string",
      "description": "the TSX to check"
    }
  },
  "required": [
    "code"
  ]
}

get_app_setup

How an app is set up so these components work and follow its theme, one topic at a time: the app-root providers in the order that works, the theme hooks and token scales, or the rules that hold across the whole catalog. An app built by emit_app already has all three wired.

Parameters2

topic	string	required
platform	string	optional	rules only

Raw schema

{
  "type": "object",
  "properties": {
    "topic": {
      "type": "string",
      "enum": [
        "providers",
        "theme",
        "rules"
      ]
    },
    "platform": {
      "type": "string",
      "enum": [
        "ios",
        "android"
      ],
      "description": "rules only"
    }
  },
  "required": [
    "topic"
  ]
}

emit_app

Needs a subscription. Turns an App Designer design into a working Expo app: navigation, providers, tab bar, screens and the components they use. Returns a recipe for the current project: every file with its target path, one install line and ordered steps with a check each. Pass `step` for one step in full, which does not count against the daily allowance.

Parameters4

appId	string	required	the share code from the App Designer's "Send app to agent", e.g. "34ca4babb2"
override	boolean	optional	emit even with screens flagged not ready; ask the customer first
step	string	optional	a step id from the recipe, or "review" for the screen list
page	number	optional	for step write or review; each page names the next

Raw schema

{
  "type": "object",
  "properties": {
    "appId": {
      "type": "string",
      "description": "the share code from the App Designer's \"Send app to agent\", e.g. \"34ca4babb2\""
    },
    "override": {
      "type": "boolean",
      "description": "emit even with screens flagged not ready; ask the customer first"
    },
    "step": {
      "type": "string",
      "description": "a step id from the recipe, or \"review\" for the screen list"
    },
    "page": {
      "type": "number",
      "description": "for step write or review; each page names the next"
    }
  },
  "required": [
    "appId"
  ]
}

add_screen

Needs a subscription. Adds one screen designed in the App Designer to a project. With the project's .opointo/files.json it returns the screen file, the route that mounts it and the one line to register it, and never rewrites existing files. Without it, a self-contained screen file for any Expo app.

Parameters5

appId	string	required	the share code from "Send app to agent"
screen	string	optional	the new screen's name in that design
manifest	object	optional	the parsed .opointo/files.json
tab	string	optional	nest it in this tab's stack; omit to place it where the design does
componentName	string	optional	only to add a second copy of a screen; omit for the export's name

Raw schema

{
  "type": "object",
  "properties": {
    "appId": {
      "type": "string",
      "description": "the share code from \"Send app to agent\""
    },
    "screen": {
      "type": "string",
      "description": "the new screen's name in that design"
    },
    "manifest": {
      "type": "object",
      "description": "the parsed .opointo/files.json"
    },
    "tab": {
      "type": "string",
      "description": "nest it in this tab's stack; omit to place it where the design does"
    },
    "componentName": {
      "type": "string",
      "description": "only to add a second copy of a screen; omit for the export's name"
    }
  },
  "required": [
    "appId"
  ]
}

install_component

Needs a subscription, except for the free foundation components. Adds one component to an existing project: the files it and its dependencies need in install order with exact target paths, the single expo install line, the providers it needs and its runtime rules. A backend recipe's id, such as "supabase", adds that integration: its files and the per-app wiring an export writes.

Parameters1

slug

string

required

e.g. "button", or a recipe id such as "supabase"

Raw schema

{
  "type": "object",
  "properties": {
    "slug": {
      "type": "string",
      "description": "e.g. \"button\", or a recipe id such as \"supabase\""
    }
  },
  "required": [
    "slug"
  ]
}

update_components

Needs a subscription. Reads the project's .opointo/files.json and returns only the opointo-supplied files that changed since export, so it works months later with no share code. Never touches the customer's own screens, and flags the rare change that needs a code edit rather than a copy.

Parameters4

manifest	object	required	the parsed .opointo/files.json (the object or its files array)
current	array	optional	only when a split-unverified blocker asks: each named file's hash, from its command
acceptSplit	array	optional	only once the customer agreed: the paths split-customer-edited blockers name
page	number	optional	only when the answer's page.next asks for it

Raw schema

{
  "type": "object",
  "properties": {
    "manifest": {
      "type": "object",
      "description": "the parsed .opointo/files.json (the object or its files array)"
    },
    "current": {
      "type": "array",
      "description": "only when a split-unverified blocker asks: each named file's hash, from its command",
      "items": {
        "type": "object",
        "properties": {
          "path": {
            "type": "string"
          },
          "sha": {
            "type": "string"
          },
          "missing": {
            "type": "boolean"
          }
        },
        "required": [
          "path"
        ]
      }
    },
    "acceptSplit": {
      "type": "array",
      "items": {
        "type": "string"
      },
      "description": "only once the customer agreed: the paths split-customer-edited blockers name"
    },
    "page": {
      "type": "number",
      "description": "only when the answer's page.next asks for it"
    }
  },
  "required": [
    "manifest"
  ]
}

verify_app

Needs a subscription. Checks an emitted app before it is built: missing files, altered verbatim files, absent packages, the expo-router config merge, whether the installed Xcode can build it, and whether a change needs a new native build.

Parameters5

appId	string	optional	the share code given to emit_app; `appId` in .opointo/files.json
files	array	required	each file written, the hidden .opointo/files.json included: { path, bytes }, path from the project root
dependencies	array	optional	package.json dependencies' keys
config	object	optional
toolchain	object	optional

Raw schema

{
  "type": "object",
  "properties": {
    "appId": {
      "type": "string",
      "description": "the share code given to emit_app; `appId` in .opointo/files.json"
    },
    "files": {
      "type": "array",
      "description": "each file written, the hidden .opointo/files.json included: { path, bytes }, path from the project root",
      "items": {
        "type": "object",
        "properties": {
          "path": {
            "type": "string"
          },
          "bytes": {
            "type": "number",
            "description": "size in bytes on disk as `wc -c` reports, not the character count"
          },
          "sha": {
            "type": "string",
            "description": "optional; when sent, the byte check is skipped"
          }
        },
        "required": [
          "path"
        ]
      }
    },
    "dependencies": {
      "type": "array",
      "items": {
        "type": "string"
      },
      "description": "package.json dependencies' keys"
    },
    "config": {
      "type": "object",
      "properties": {
        "main": {
          "type": "string",
          "description": "package.json \"main\""
        },
        "scheme": {
          "type": "string",
          "description": "app.json"
        },
        "plugins": {
          "type": "array",
          "items": {
            "type": "string"
          },
          "description": "app.json"
        },
        "userInterfaceStyle": {
          "type": "string",
          "description": "app.json"
        },
        "moduleSuffixes": {
          "type": "array",
          "items": {
            "type": "string"
          },
          "description": "tsconfig compilerOptions"
        },
        "nativeModulesDir": {
          "type": "string",
          "description": "package.json expo.autolinking; omit if unset"
        },
        "icon": {
          "type": "string",
          "description": "app.json"
        },
        "monochromeImage": {
          "type": "string",
          "description": "app.json android.adaptiveIcon"
        },
        "supportsTablet": {
          "type": "boolean",
          "description": "app.json ios"
        }
      }
    },
    "toolchain": {
      "type": "object",
      "properties": {
        "xcode": {
          "type": "string",
          "description": "`xcodebuild -version`, e.g. \"26.2\"; omit without Xcode"
        },
        "expoSdk": {
          "type": "string",
          "description": "the INSTALLED expo version, e.g. \"56.0.15\" (`npm ls expo`)"
        },
        "expoBuildProperties": {
          "type": "string",
          "description": "the INSTALLED expo-build-properties version; omit if absent"
        },
        "enableSceneSupport": {
          "type": "boolean",
          "description": "app.json expo-build-properties ios.enableSceneSupport"
        },
        "nativeFingerprint": {
          "type": "string"
        },
        "lastBuildFingerprint": {
          "type": "string"
        }
      }
    }
  },
  "required": [
    "files"
  ]
}

propose_app

Your agent can design an app with you: send an app in opointo's design format (the AppSpec emit_app builds from) and get back a link that opens it in the App Designer as a new, unsaved design. The person sees every screen and the navigation, changes what they like, and hands it back for emit_app. Each problem comes back with its path and a fix. dryRun checks without making a link; format: true returns the format and every block, or with app: { version: 1 } a short plan's.

Parameters3

app	object	optional	The design: { name, tabs: [{ screenId, label }], screens: [{ id, name, composition: { screen: { content: { children: [node] }, chrome: { header?, headerItems?, floating: [] }, overlays: [] } } }], onboardingScreenIds: [], pushed: [{ screenId, fromScreenId, presentation }], theme? }. A node is { id, slug, props }: slug is "wireframe:<block>" such as "wireframe:list-row" (a list whose rows open one screen is one row block with repeats: "true" and its sample rows in rows: [{ title, ... }]) or a component from find_component, and a content node opens a screen with navigate: { to, presentation } beside its props. A top bar is header: { id, slug: "header", props: {} }, titled by the screen's name; a sheet has none. entryScreenId is only for a splash screen before the tabs. Tab icons, titles and composition metadata are set by the builder.
dryRun	boolean	optional	check the design and report, without making a link
format	boolean	optional

Raw schema

{
  "type": "object",
  "properties": {
    "app": {
      "type": "object",
      "description": "The design: { name, tabs: [{ screenId, label }], screens: [{ id, name, composition: { screen: { content: { children: [node] }, chrome: { header?, headerItems?, floating: [] }, overlays: [] } } }], onboardingScreenIds: [], pushed: [{ screenId, fromScreenId, presentation }], theme? }. A node is { id, slug, props }: slug is \"wireframe:<block>\" such as \"wireframe:list-row\" (a list whose rows open one screen is one row block with repeats: \"true\" and its sample rows in rows: [{ title, ... }]) or a component from find_component, and a content node opens a screen with navigate: { to, presentation } beside its props. A top bar is header: { id, slug: \"header\", props: {} }, titled by the screen's name; a sheet has none. entryScreenId is only for a splash screen before the tabs. Tab icons, titles and composition metadata are set by the builder."
    },
    "dryRun": {
      "type": "boolean",
      "description": "check the design and report, without making a link"
    },
    "format": {
      "type": "boolean"
    }
  }
}

propose_screen

Your agent can design a single screen with you: send one screen in opointo's design format (the Composition add_screen builds from) and get back a link that opens it in the App Designer as a new, unsaved design the person can change. Each problem comes back with its path and a fix. dryRun checks without making a link; format: true returns the format. For a whole app with navigation, propose_app is the matching tool.

Parameters3

composition	object	optional	One screen: { name, screen: { content: { children: [node] }, chrome: { header?, headerItems?, floating: [] }, overlays: [] } }. A node is { id, slug, props }: slug is "wireframe:<block>" or a component from find_component.
dryRun	boolean	optional	check the screen and report, without making a link
format	boolean	optional

Raw schema

{
  "type": "object",
  "properties": {
    "composition": {
      "type": "object",
      "description": "One screen: { name, screen: { content: { children: [node] }, chrome: { header?, headerItems?, floating: [] }, overlays: [] } }. A node is { id, slug, props }: slug is \"wireframe:<block>\" or a component from find_component."
    },
    "dryRun": {
      "type": "boolean",
      "description": "check the screen and report, without making a link"
    },
    "format": {
      "type": "boolean"
    }
  }
}

README.md3 KBView on GitHub

opointo MCP server

Design your app visually. Get a working native app.

opointo is an App Builder: you design your app in the browser (screens, blocks, navigation drawn as arrows, your theme), and your coding agent turns it into a real Expo project you own. One codebase for iOS and Android, with Liquid Glass on iOS 26 and Material 3 Expressive on Android.

This MCP server is how the design reaches your agent. It lives at:

code

https://opointo.com/api/mcp

Streamable HTTP. This repository holds the server's public listing and setup instructions, not its source.

Tools

Free, no account: everything your agent needs to use the components correctly.

Tool	What it does
`list_components`	The shipped components, and which render the real iOS system control
`get_component`	Props, types, defaults and value domains for one component
`find_component`	Ranked components for a UI need described in plain language
`get_rules`	The runtime rules: the mistakes that make a component render blank
`get_provider_tree`	The app-root provider nesting, in the order that works
`get_theme_tokens`	Theme hooks and the spacing, radius and typography scales
`check_snippet`	Finds blank-render bugs in TSX that uses these components
`get_step`	Expands one step of an app recipe

With a subscription: the tools that write and verify your app.

Tool	What it does
`emit_app`	Turns your opointo design into a working Expo app: navigation, providers, tab bar, screens
`emit_screen`	Turns one designed screen into a file for an app that already exists
`add_screen`	Adds a new screen to an exported app
`install_component`	Adds one component to an existing project
`update_components`	Updates the opointo-supplied files as iOS and Android move
`verify_app`	Checks the emitted app was applied correctly, before it is built

Plans and the licence key: opointo.com/pricing.

Setup

Each snippet below adds the free tools. For the paid tools, add your licence key as a bearer token; opointo.com/mcp has the exact variant for each agent.

Claude Code

code

claude mcp add --transport http --scope user opointo https://opointo.com/api/mcp

Cursor (~/.cursor/mcp.json)

json

{
  "mcpServers": {
    "opointo": { "url": "https://opointo.com/api/mcp" }
  }
}

VS Code (.vscode/mcp.json)

json

{
  "servers": {
    "opointo": { "type": "http", "url": "https://opointo.com/api/mcp" }
  }
}

Codex

code

codex mcp add opointo --url https://opointo.com/api/mcp

Gemini CLI

code

gemini mcp add --scope user --transport http opointo https://opointo.com/api/mcp

Requirements

Exported apps are Expo projects. Building them for iOS needs a Mac with Xcode 26; see opointo.com/compatibility for what is verified on which platform.

Install

Tools (11)

find_componentget_componentcheck_snippetget_app_setupemit_appadd_screeninstall_componentupdate_components

Remote endpoint

Streamable HTTP

Hosted server - connect over the network, no local install.

url

https://opointo.com/api/mcp

Add to VS Code Add to Cursor

claude_desktop_config.json

json

{
  "mcpServers": {
    "opointo": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "https://opointo.com/api/mcp"
      ]
    }
  }
}

Desktop config is stdio-only; this bridges via mcp-remote. Native remote: Settings > Connectors.

opointo

MCP Server: com.opointo/opointo

🛠️ Key Features

🚀 Use Cases

⚡ Developer Benefits

⚠️ Limitations

find_component

get_component

check_snippet

get_app_setup

emit_app

add_screen

install_component

update_components

verify_app

propose_app

propose_screen

opointo MCP server

Tools

Setup

Requirements

Links

Install

Remote endpoint

Related servers