Skip to main content

MCP server for the Web UI Component Specification — behavioral specs, tests, and principles for web UI component libraries

Project description

Web UI Component Specification — MCP Server

An MCP (Model Context Protocol) server that gives AI coding assistants direct access to the Web UI Component Specification — a comprehensive behavioral reference for web UI component libraries covering component specs, test scenarios, accessibility requirements, and a step-by-step build guide.


What this does

Instead of pasting spec content into prompts manually, this server lets your AI assistant query exactly what it needs, when it needs it:

  • Building a component? → Fetch its full spec on demand
  • Writing tests? → Get just the test scenarios
  • Starting a library? → Get a curated component list for your project type
  • Reviewing an implementation? → Validate it against the spec automatically

Read the specification

Prefer the human-readable version? Download the full spec as a PDF:

Web UI Component Specification (v1.0) — PDF

All exported versions live under exports/.


Installation

Option 1 — uvx (recommended, no install required)

uvx web-ui-component-spec-mcp

Option 2 — pip

pip install web-ui-component-spec-mcp
web-ui-component-spec-mcp

Option 3 — Clone and run

git clone https://github.com/gcsebas99/web-ui-component-spec-mcp.git
cd web-ui-component-spec-mcp
pip install -r requirements.txt

Then execute server.py.

python server.py

MCP Client Configuration

Add to your MCP client config (Claude Desktop, Cursor, etc.):

uvx:

{
  "mcpServers": {
    "ui-spec": {
      "command": "uvx",
      "args": ["web-ui-component-spec-mcp"]
    }
  }
}

pip install:

{
  "mcpServers": {
    "ui-spec": {
      "command": "web-ui-component-spec-mcp"
    }
  }
}

Clone and run:

{
  "mcpServers": {
    "ui-spec": {
      "command": "python",
      "args": ["/absolute/path/to/web-ui-component-spec-mcp/server.py"]
    }
  }
}

Source files

The spec content (Markdown files) are included in the source/ directory (latest version available):

File Description
source/Core_Principles.md Component philosophy, design tokens, interaction principles
source/Component_Catalog.md Full catalog of all components with specs and tests
source/Step_By_Step_Guide.md Step-by-step build guide

Available tools

Tool Description
list_components Full component index with optional category/tier filtering
get_component_spec Full spec for one component
get_component_tests Test scenarios only for one or more components
get_component_summary Lightweight summary (description + main features)
get_components_by_scenario Curated component list for a project type
get_core_principles Core Principles by section
get_step_by_step Step-by-step guide by step number
get_related_components Dependencies, dependents, and alternatives
search_components Fuzzy search by behavior or description
validate_component_checklist Coverage report against spec requirements

Using the skill

For best results, load the skill file into your AI assistant's system prompt before starting a component build session.

Full skill (recommended for new sessions): skill/skill-full.md

Compact skill (for mid-session use when context is limited): skill/skill-compact.md


Example prompts

See examples/example-prompts.md for ready-to-use prompts covering common scenarios: building a component, starting a library, reviewing code, writing tests.


Project structure

web-ui-component-spec-mcp/
├── server.py              # MCP server entry point
├── pyproject.toml         # PyPI packaging (pip + uvx)
├── requirements.txt       # Direct install dependencies
│
├── tools/                 # One file per MCP tool
├── parsers/               # MD parsing logic
├── data/                  # In-memory store (loaded at startup)
│
├── source/                # Spec MD files (bundled; VERSION.md pins the revision)
├── exports/                # Human-readable PDF exports of the spec
├── skill/                 # Skill files for AI assistants
└── examples/              # Example prompts

Spec version

This server is built for Web UI Component Specification v1.0.

Spec version Server version
v1.0 1.0.x

License

MIT

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

web_ui_component_spec_mcp-1.0.2.tar.gz (157.4 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

web_ui_component_spec_mcp-1.0.2-py3-none-any.whl (170.3 kB view details)

Uploaded Python 3

File details

Details for the file web_ui_component_spec_mcp-1.0.2.tar.gz.

File metadata

  • Download URL: web_ui_component_spec_mcp-1.0.2.tar.gz
  • Upload date:
  • Size: 157.4 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: uv/0.9.29 {"installer":{"name":"uv","version":"0.9.29","subcommand":["publish"]},"python":null,"implementation":{"name":null,"version":null},"distro":{"name":"macOS","version":null,"id":null,"libc":null},"system":{"name":null,"release":null},"cpu":null,"openssl_version":null,"setuptools_version":null,"rustc_version":null,"ci":null}

File hashes

Hashes for web_ui_component_spec_mcp-1.0.2.tar.gz
Algorithm Hash digest
SHA256 870a3e6aee366fceb0d17f3361867b4e0eb180d5bc323bea351f0580d8a0a3f8
MD5 d786827f5d00ba60e7f6c459b2ac9bff
BLAKE2b-256 889839fa3c09f4e574744ddfed469e42a135e6bb01c28a1112297072938f8e36

See more details on using hashes here.

File details

Details for the file web_ui_component_spec_mcp-1.0.2-py3-none-any.whl.

File metadata

  • Download URL: web_ui_component_spec_mcp-1.0.2-py3-none-any.whl
  • Upload date:
  • Size: 170.3 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: uv/0.9.29 {"installer":{"name":"uv","version":"0.9.29","subcommand":["publish"]},"python":null,"implementation":{"name":null,"version":null},"distro":{"name":"macOS","version":null,"id":null,"libc":null},"system":{"name":null,"release":null},"cpu":null,"openssl_version":null,"setuptools_version":null,"rustc_version":null,"ci":null}

File hashes

Hashes for web_ui_component_spec_mcp-1.0.2-py3-none-any.whl
Algorithm Hash digest
SHA256 24eca08e06ea1f92ea16fa492211a07b3784e8f5060e7ff0a6450967ecf36c2d
MD5 ee77ca8e43dd1d4080f2c369ca12b76f
BLAKE2b-256 3938ed01fbb2d0b6933fe79b5945363eda55cf04964ce0682d7c116d941a6266

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page