Skip to main content
Glama
ttoino

Material Design MCP Server

by ttoino

Material Design MCP-Server

Ein Cloudflare Worker, der einen MCP (Model Context Protocol)-Server zum Durchsuchen der Material Design 3-Dokumentation bereitstellt.

Funktionen

  • list_sections — Entdecken Sie die obersten Dokumentationsabschnitte (Grundlagen, Komponenten, Stile usw.)

  • get_page — Navigieren Sie zu jeder beliebigen Material Design-Seite und erhalten Sie deren Inhalt als sauberes Markdown

Related MCP server: mdbook-mcp-server

Architektur

  • Laufzeit: Cloudflare Workers (TypeScript, nodejs_compat)

  • Router: Hono

  • Browser-Automatisierung: Browser Run (Puppeteer-Bindung)

  • Markdown-Konvertierung: Workers AI toMarkdown()

  • MCP-Transport: Streamable HTTP (@modelcontextprotocol/server v2)

Da m3.material.io eine JavaScript-lastige SPA ist, verwendet der Worker Puppeteer, um auf das Rendern des clientseitigen <article>-Elements zu warten, bevor der Inhalt extrahiert wird.

Voraussetzungen

Einrichtung

# Install dependencies
pnpm install

# Generate TypeScript types from wrangler.jsonc
pnpm run gen:cf-types

Entwicklung

# Start local dev server (connects to remote Cloudflare services)
pnpm dev

Der MCP-Endpunkt ist unter http://localhost:8787/mcp verfügbar.

Bereitstellung

pnpm deploy

MCP-Tools

list_sections

Gibt die obersten Dokumentationsabschnitte aus der Material Design-Sitemap zurück.

Eingabe: keine

Beispielausgabe:

blog
components
develop
foundations
get-started
styles

get_page

Navigiert zu einer bestimmten Material Design-Seite, extrahiert den Artikelinhalt und konvertiert ihn in Markdown.

Eingabe:

  • path — URL-Pfad auf m3.material.io (z. B. /foundations/overview)

Beispielausgabe:

## Accessibility & Material Design

**Accessibility by default** is a core design value for Material...

Verbinden eines MCP-Clients

Jeder MCP-Client, der Streamable HTTP unterstützt, kann sich verbinden mit:

https://<your-worker>.<your-subdomain>.workers.dev/mcp

Zum Beispiel mit Claude Desktop:

{
    "mcpServers": {
        "material-design": {
            "url": "https://material-mcp.your-account.workers.dev/mcp"
        }
    }
}

Lizenz

MIT

Related MCP Connectors

Related MCP Servers

  • A
    license
    A
    quality
    D
    maintenance
    Enables access to OpenTelemetry documentation by fetching and converting pages to markdown format and searching content using Google Custom Search. Provides comprehensive documentation lookup and search capabilities for OpenTelemetry concepts, instrumentation, and configuration.
    2
    3
    Apache 2.0
  • A
    license
    A
    quality
    C
    maintenance
    Provides programmatic access to Material Web documentation and components for AI agents, enabling documentation search, template generation, and HTML validation.
    7
    9 npm
    1
    MIT