Mobbin

MCP-Server von Mobbin

Search real-world UI and UX design references for mobile apps, web apps and websites from Mobbin's screenshot library.

OAuth-Anmeldung (Beim ersten Verbinden meldest du dich beim Anbieter an)Streamable HTTP

Mit Mobbin verbinden

Mobbin braucht eine Anmeldung. Verbinde dich mit seiner eigenen URL:

https://api.mobbin.com/mcp

Dein Client öffnet beim ersten Mal die Anmeldung von Mobbin. Das Token bleibt zwischen deinem Client und Mobbin.

Diesen Server teilen

Öffnet diese Seite, mit der URL und den Einrichtungsschritten.

mcp.tc/i/mobbin

Über den Server

Mobbin connects your assistant to its library of searchable mobile and web app screens and flows. Use it to find real-world UI and UX examples as design reference while you build or review a product.

It is a hosted remote server using Streamable HTTP at https://api.mobbin.com/mcp. Nothing is installed locally and no API key is needed. On first use, your client opens a browser window so you can sign in to Mobbin and authorize access through OAuth.

Was du damit machen kannst

  • Search real-world UI and UX design references
  • Browse mobile app, web app and website screens
  • Look up app flows for design reference

Tools

Mobbin zeigt seine Tools erst nach der Anmeldung, deshalb können wir sie hier nicht auflisten. Dein Client zeigt sie, sobald du verbunden bist.

Beispiel-Prompts

  • Find onboarding screens from popular fintech mobile apps

  • Show me real examples of pricing page designs for SaaS websites

  • Search Mobbin for checkout flows in e-commerce apps

  • Find settings screen examples to inspire my app redesign

Einrichtung

Jeder Client verbindet sich mit api.mobbin.com, und beim ersten Mal fragt Mobbin nach deiner Anmeldung. Wähl deinen; die Seite merkt sich deine Wahl.

Claude Code

  1. Führe das in einem Terminal in deinem Projektordner aus:
claude mcp add --transport http mobbin https://api.mobbin.com/mcp
  1. Starte Claude Code, tippe /mcp, wähle mobbin und dann Authenticate. Ein Browserfenster öffnet sich für die Anmeldung bei Mobbin.

Ergänze --scope user, damit er in jedem Projekt verfügbar ist, nicht nur in diesem.

Claude Desktop

  1. Öffne Settings → Connectors und klick auf Add custom connector.
  2. Nenne ihn Mobbin und füge diese URL ein:
https://api.mobbin.com/mcp
  1. Klick auf Add, dann auf Connect, und melde dich an, wenn Mobbin danach fragt.

Die JSON-Konfigurationsdatei von Claude Desktop startet nur lokale Server. Remote-Server laufen über Connectors, und Connectors, die du auf claude.ai hinzufügst, erscheinen auch hier.

claude.ai

  1. Öffne das Connector-Formular auf claude.ai. Dieser Button füllt Name und URL für dich aus:
  1. Prüfe, dass die URL https://api.mobbin.com/mcp lautet, und klick auf Add.
  2. Klick auf Connect und melde dich an, wenn Mobbin danach fragt.

Kostenlose Pläne erlauben einen benutzerdefinierten Connector. In Team- und Enterprise-Plänen fügt ihn ein Owner unter Organization settings → Connectors hinzu.

ChatGPT

  1. Öffne auf chatgpt.com Settings → Security and login und schalte Developer mode ein.
  2. Geh zu chatgpt.com/plugins und klick auf +, um eine App für einen Remote-MCP-Server anzulegen.
  3. Füge https://api.mobbin.com/mcp als Server-URL ein und wähle OAuth. ChatGPT schickt dich zur Anmeldung zu Mobbin.

Der Entwicklermodus steht im Web für Plus-, Pro-, Business-, Enterprise- und Education-Konten zur Verfügung.

Cursor

Oder trag ihn von Hand in ~/.cursor/mcp.json (alle Projekte) oder .cursor/mcp.json (dieses Projekt) ein:

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

Cursor zeigt neben dem Server Needs login. Klick darauf, um dich anzumelden.

VS Code

Oder aus einem Terminal:

code --add-mcp '{"name":"mobbin","type":"http","url":"https://api.mobbin.com/mcp"}'

Oder committe ihn ins Repository in .vscode/mcp.json:

.vscode/mcp.json
{
  "servers": {
    "mobbin": {
      "type": "http",
      "url": "https://api.mobbin.com/mcp"
    }
  }
}

VS Code bittet dich beim ersten Start des Servers um eine Anmeldung.

Devin Desktop

  1. Füge ihn zu ~/.config/devin/mcp_config.json (macOS und Linux) oder %APPDATA%\devin\mcp_config.json (Windows) hinzu:
mcp_config.json
{
  "mcpServers": {
    "mobbin": {
      "serverUrl": "https://api.mobbin.com/mcp"
    }
  }
}
  1. Aktualisiere die Liste der MCP-Server in Cascade und melde dich an, wenn du gefragt wirst.

Devin Desktop ist der neue Name von Windsurf. Für Remote-Server liest es serverUrl (oder url).

Codex

codex mcp add mobbin --url https://api.mobbin.com/mcp
codex mcp login mobbin

Oder bearbeite ~/.codex/config.toml direkt:

config.toml
[mcp_servers.mobbin]
url = "https://api.mobbin.com/mcp"

Gemini CLI

gemini mcp add --transport http mobbin https://api.mobbin.com/mcp

Führe dann in Gemini CLI /mcp auth mobbin aus, um dich anzumelden.

Damit fügst du ihn dem aktuellen Projekt hinzu. Ergänze -s user, um ihn überall zu nutzen.

Jeder Client

Die meisten Clients akzeptieren diese Form. Manche nennen das URL-Feld anders: serverUrl in Devin Desktop, httpUrl in der Einstellungsdatei von Gemini CLI.

{
  "mcpServers": {
    "mobbin": {
      "type": "http",
      "url": "https://api.mobbin.com/mcp"
    }
  }
}

Zed legt Server in seinen Einstellungen unter context_servers ab. Cline braucht "type": "streamableHttp", sonst nimmt es SSE an.

Dein Client startet nur lokale Server? Binde ihn mit npx -y mcp-remote https://api.mobbin.com/mcp an.

Häufige Fragen

Kann ich mcp.tc/i/mobbin in meinen MCP-Client einfügen?

Nein. mcp.tc-Links sind Seiten, keine Server-Adressen. Verbinde dich mit https://api.mobbin.com/mcp, damit dein Client direkt mit Mobbin spricht. Das Anmelde-Token funktioniert ohnehin nur dort. Der Quick-Link ist zum Teilen da: Er öffnet diese Seite, mit Einrichtungsschritten für jeden Client.

Braucht Mobbin einen API-Schlüssel oder eine Anmeldung?

Ja, du brauchst ein Konto bei Mobbin. Wenn sich dein Client zum ersten Mal verbindet, öffnet er die Anmeldeseite von Mobbin. Das Token geht direkt an die eigene URL des Servers, nie über mcp.tc.

Ist Mobbin ein Remote- oder ein lokaler Server?

Remote. Mobbin hostet ihn unter https://api.mobbin.com/mcp, und er spricht Streamable HTTP. Es gibt nichts zu installieren.

Was kann Mobbin?

Du kannst damit Search real-world UI and UX design references, Browse mobile app, web app and website screens und Look up app flows for design reference.

Welche Clients können ihn nutzen?

Jeder Client, der Remote-MCP-Server unterstützt: Claude Code, Claude Desktop, claude.ai, ChatGPT im Entwicklermodus, Cursor, VS Code, Devin Desktop, Codex, Gemini CLI, Zed und andere. Die Einrichtungsschritte decken jeden davon ab.

Wer hat diese Seite geschrieben?

Der Roboter von mcp.tc hat die eigenen Metadaten von Mobbin (seinen MCP-Handshake, seine Tool-Liste und öffentliche Seiten) gelesen, und ein KI-Modell hat daraus den Text entworfen. Ein Mensch prüft alles, was die Prüfungen nicht bestätigen können. Der Text kann trotzdem falsch sein; wenn dir ein Fehler auffällt, nutze Eintrag melden auf dieser Seite.

Einbinden

Zeig Mobbin in einem README oder auf deiner Website. Jede Einbindung verlinkt auf diese Seite, nutzt die eigene URL des Servers und setzt keine Cookies. So funktionieren Einbindungen

README-Badge

Badge-Vorschau, hellBadge-Vorschau, dunkel
Markdown
[![Mobbin on mcp.tc](https://mcp.tc/i/mobbin/badge.svg)](https://mcp.tc/i/mobbin)
HTML
<a href="https://mcp.tc/i/mobbin"><img src="https://mcp.tc/i/mobbin/badge.svg" alt="Mobbin on mcp.tc" height="20"></a>

Es folgt dem hellen oder dunklen Modus der Lesenden. Hänge ?theme=light oder ?theme=dark an, um ihn festzulegen, oder ?style=compact, um das Zeichen ohne Schriftzug zu zeigen.

Website-Karte

HTML
<script src="https://mcp.tc/w/mobbin.js" async></script>

Die Karte erscheint dort, wo das Tag steht. Füge dem Tag data-theme="dark" oder data-size="compact" hinzu, um sie zu ändern. Die Datei enthält alles, was sie braucht, stellt also keine weiteren Anfragen und setzt keine Cookies.

iframe

HTML
<iframe src="https://mcp.tc/embed/mobbin" title="Mobbin on mcp.tc" width="420" height="200" loading="lazy" allow="clipboard-write" style="border:0;border-radius:8px;max-width:100%"></iframe>

Nutze es auf Seiten, die keine Skripte erlauben. Hänge ?theme=light oder ?theme=dark an die Adresse an, um die Farben festzulegen.

JSON

Der Eintrag als Daten für deine eigenen Seiten und Tools: Name, Kurzbeschreibung, die eigene URL des Servers, Tools und die „Add to“-Links. Jede Website kann ihn lesen (CORS ist offen).

https://mcp.tc/i/mobbin.json

Was jedes Feld bedeutet

mcp.tc ist nicht mit Mobbin verbunden. Diese Seite entstand aus den öffentlichen Metadaten von Mobbin, zuletzt geprüft am 3. Okt. 2026, und ein KI-Modell hat die Beschreibung geschrieben, sie kann also Fehler enthalten. Namen und Marken gehören ihren Inhabern. Stimmt etwas nicht? Eintrag melden.