Prototyp · Vorschau: alle Server aus der offiziellen Registry, alle 30 Minuten synchronisiert. Bewertungen und Benutzerkonten folgen in einem späteren Schritt.
PopNx MCPMCP-Server für alle, die KI nutzen · in einfachen Worten erklärt

Better Design

von better-designsVersion 0.48.0i★ –iComputer oder Cloud
Name in der Registryio.github.marvkr/better-design

Installieren

Überblick

Beschreibung vom Entwickler (englisches Original)

A design harness for AI coding agents: design systems, design principles, icons and UI review.

Die drei Säulen von PopNx MCP

Diese drei werden nie zu einer Punktzahl zusammengefasst: Meinungen, Messungen und Beliebtheit sind verschiedene Dinge.

Was du damit machen kannst

Für diesen Server haben wir noch keine Zusammenfassung in einfacher Sprache geschrieben. Unten stehen die Fakten, die wir aus der Registry gelesen haben.

  • Verbindung: Computer oder Cloud
  • Transport: stdio, Streamable HTTP
  • Kategorie: Design, Bilder & Audio
  • Das musst du eintragen: BETTER_DESIGN_API_KEY

Installation

Wähle die KI-App, die du nutzt, und kopiere die Einstellungen.

Bevor du installierst

  • Basischecks: 0 von 1 bestanden
  • Läuft auf dem Server des Entwicklers: Was du fragst, läuft über dessen Server.
  • Das trägst du selbst ein: BETTER_DESIGN_API_KEY

Als geheim markierte Werte sind Schlüssel zu deinem Konto. Gib sie nie weiter und füge sie nie in einen Chat ein.

Du brauchst

  • Läuft in der CloudNichts zu installieren; die Verbindung läuft übers Internet
  • npmNode.js installiert (für den Befehl npx)

Welche App nutzt du?

Wähle oben deine App. Wir merken sie uns, damit der Button beim nächsten Mal „In … installieren“ anzeigt.

Funktioniert in Claude im Web, auf dem Desktop und auf dem Handy:

  1. Öffne Settings → Connectors
  2. Tippe auf Add custom connector
  3. Füge die Adresse unten ein und tippe auf Add
  4. Wenn eine Anmeldung verlangt wird, melde dich beim Dienst des Entwicklers an
SettingsConnectors1+ Add2https://…3
https://better-design.com/api/mcp

Oder führ ihn auf deinem Computer aus

Öffne Claude Desktop → Settings → Developer → Edit Config und füge dies in claude_desktop_config.json ein

{
  "mcpServers": {
    "better-design": {
      "command": "npx",
      "args": [
        "-y",
        "better-design",
        "mcp"
      ],
      "env": {
        "BETTER_DESIGN_API_KEY": "your-value"
      }
    }
  }
}

Führe das in deinem Terminal aus

claude mcp add --transport http better-design https://better-design.com/api/mcp

Oder führ ihn auf deinem Computer aus

claude mcp add better-design --env BETTER_DESIGN_API_KEY=your-value -- npx -y better-design mcp

Trag die leeren Werte ein, bevor du ihn startest.

In Cursor öffnen

Oder kopier die Einstellungen selbst

In .cursor/mcp.json in deinem Projekt oder in ~/.cursor/mcp.json einfügen

{
  "mcpServers": {
    "better-design": {
      "url": "https://better-design.com/api/mcp"
    }
  }
}

Oder führ ihn auf deinem Computer aus

In Cursor öffnen

Oder kopier die Einstellungen selbst

In .cursor/mcp.json in deinem Projekt oder in ~/.cursor/mcp.json einfügen

{
  "mcpServers": {
    "better-design": {
      "command": "npx",
      "args": [
        "-y",
        "better-design",
        "mcp"
      ],
      "env": {
        "BETTER_DESIGN_API_KEY": "your-value"
      }
    }
  }
}

Dein Browser fragt, ob er die App öffnen darf, dann zeigt die App die Einstellungen und bittet dich um Bestätigung. Schlüsselwerte bleiben leer, damit du sie selbst einträgst.

In VS Code öffnen

Oder kopier die Einstellungen selbst

In .vscode/mcp.json in deinem Projekt einfügen

{
  "servers": {
    "better-design": {
      "type": "http",
      "url": "https://better-design.com/api/mcp"
    }
  }
}

Oder führ ihn auf deinem Computer aus

In VS Code öffnen

Oder kopier die Einstellungen selbst

In .vscode/mcp.json in deinem Projekt einfügen

{
  "servers": {
    "better-design": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "better-design",
        "mcp"
      ],
      "env": {
        "BETTER_DESIGN_API_KEY": "your-value"
      }
    }
  }
}

Dein Browser fragt, ob er die App öffnen darf, dann zeigt die App die Einstellungen und bittet dich um Bestätigung. Schlüsselwerte bleiben leer, damit du sie selbst einträgst.

ChatGPT verbindet sich nur mit Servern im Internet:

  1. Öffne ChatGPT im Web → Settings → Connectors (Apps)
  2. Tippe auf Create oder Add (bei manchen Tarifen musst du zuerst Developer mode unter Advanced einschalten)
  3. Füge die Adresse unten ein, gib ihr einen Namen und speichere
  4. Wenn eine Anmeldung verlangt wird, melde dich beim Dienst des Entwicklers an
SettingsConnectors1+ Create2https://…3
https://better-design.com/api/mcp

Menünamen können sich je nach Tarif und mit der Zeit leicht unterscheiden.

Deine Auswahl bleibt in einem Cookie auf diesem Gerät; kein Konto nötig.

Werte, die du selbst einträgst

  • BETTER_DESIGN_API_KEY geheim erforderlich env
    Create or manage a key at https://better-design.com/mcp

Diese Einstellungen werden aus dem Registry-Eintrag des Entwicklers erzeugt. Wenn in der README etwas anderes steht, folge der README.

Was er kann

Die Tool-Liste dieses Servers haben wir noch nicht gelesen; wir prüfen die Endpunkte reihum.

Basischecksi

Wir prüfen Informationen, die jeder sehen kann; den Code haben wir nicht gelesen. Checks, die nicht zutreffen, werden nicht mitgezählt. · Geprüft am 7. Nov. 2026

  • ! Vorsicht

    Entwickler passt zum Repo

    Der Herausgeber (marvkr) ist nicht der Repo-Inhaber (better-designs); vielleicht hat jemand anderes ihn eingetragen

  • … Noch nicht geprüft

    Wird noch gepflegt

    Dieses Repo haben wir noch nicht von GitHub gelesen

  • … Noch nicht geprüft

    Hat eine Lizenz

    Dieses Repo haben wir noch nicht von GitHub gelesen

  • … Noch nicht geprüft

    Endpunkt antwortet

    Noch nicht geprüft; wir prüfen die Endpunkte reihum

  • … Noch nicht geprüft

    Anmeldung mit OAuth

    Noch nicht geprüft; wir prüfen die Endpunkte reihum

  • … Noch nicht geprüft

    Keine versteckten Anweisungen in Tool-Beschreibungen

    Noch nicht geprüft; wir lesen die Tool-Liste, wenn wir den Endpunkt prüfen

Im Vergleich mit anderen in Design, Bilder & Audioi

  • Mehr Sterne als 0 % der anderen 2202 Server in dieser Kategorie
  • Neuer in der Registry veröffentlicht als 68 % der anderen 2202 Server in dieser Kategorie
  • Basischecks gleich gut wie oder besser als bei 31 % der anderen 2202 Server in dieser Kategorie

Verglichen mit allen aktiven Servern dieser Kategorie in der Registry. Sterne zählen nur, wenn dem Herausgeber das Repo gehört.

Häufige Fragen

Ist Better Design sicher?

Er hat 0 von 1 zutreffenden Basischecks bestanden. Den Code haben wir nicht gelesen. Bevor du einen Schlüssel oder Token hinzufügst, sieh nach, welche Zugriffe der Server verlangt, und nutze einen Schlüssel, der nur die Berechtigungen hat, die du brauchst.

Welche Schlüssel oder Codes braucht er?

Das musst du eintragen: BETTER_DESIGN_API_KEY

Läuft er auf meinem Computer oder in der Cloud?

Beides geht: Installiere ihn auf deinem Computer oder verbinde dich mit der Cloud-Version.

Wird er noch gepflegt?

Das GitHub-Repo wurde zuletzt – geändert, und die neueste Version (0.48.0) kam vor 15 Tagen in die Registry.

Welche Apps können ihn nutzen?

Apps, die MCP unterstützen, etwa Claude Desktop, Claude Code, Cursor und VS Code. Er verbindet sich per URL, also funktionieren auch Apps, die Remote-MCP-Server akzeptieren, zum Beispiel ChatGPT im Entwicklermodus.

Was kann ich stattdessen nutzen?

In derselben Kategorie: Figma Context MCP, Claude Real Video, Figma MCP Server

Alternativen

Server derselben Kategorie von anderen Entwicklern, sortiert nach Sternen.

So liest du eine Karte:★ GitHub-SterneiDrei Säulen: Bewertungen · Checks · NutzungiAktualisiert = neueste Version in der Registry veröffentlichti

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

Läuft auf deinem Computer★ 16.165MITAktualisiert vor 5 Monaten
Installieren

Claude Real Video

von HUANGCHIHHUNGLeo

Let any LLM watch a video locally — and search everything it has ever watched.

Läuft auf deinem Computer★ 2.284MITAktualisiert vor 2 Monaten
Installieren

The Figma MCP server brings Figma design context directly into your AI workflow.

Läuft in der Cloud★ 2.152Aktualisiert vor 13 Monaten
Installieren

README vom Entwickler

README öffnen

Unverändert aus dem Repo des Entwicklers übernommen. PopNx MCP hat den Inhalt weder geprüft noch empfiehlt es ihn. HTML, Bilder und Skripte wurden entfernt. Links führen von dieser Website weg.

Better Design

A design harness for AI coding agents. This plugin connects your agent to the Better Design MCP server, so the interfaces it builds use a real design system, follow design principles, and pass UI review checks.

What your agent gets

  • A design system for your app. Find one that fits your product, preview it, and install its components, or generate a custom one from a description or your own site.
  • Design principles. Visual design, UX flows, forms, onboarding and interface copy, plus references for React Native, SwiftUI, Three.js and Shopify themes.
  • Review checks. Accessibility, copy clarity and measured spacing for the screens your agent builds.
  • Icons you own. Icon sets returned as React components, with no runtime CDN.

What this repository holds

This repository holds the plugin files only: the manifests, the MCP server entry and two skills. The Better Design server and its design systems run at better-design.com. Browse the catalog at better-design.com/design-systems.

SkillWhat it does
build-with-better-designChooses a design system with the user, installs it, and builds on it
review-ui-with-better-designReviews a screen for accessibility, visual design, copy clarity and spacing

Install

ToolHow
Any terminal agent, no accountnpx better-design
Gemini CLIgemini extensions install https://github.com/better-designs/better-design-plugin
Claude Code/plugin marketplace add better-designs/better-design-plugin, then /plugin install better-design@better-design
Claude Code, MCP onlyclaude mcp add --transport http better-design https://better-design.com/api/mcp
Any skills clientnpx skills add better-designs/better-design-plugin
Any MCP clientAdd the remote server https://better-design.com/api/mcp

npx better-design needs no account. It connects Better Design to your coding tools and creates a free key with a small allowance. When the allowance runs out, the agent gives you a claim link that moves the key onto a free account.

Every other route opens a Better Design sign-in on the first connection. A free account works.

Privacy

Better Design's privacy policy and terms apply. Support: info@better-design.com.

PopNx fragen