ECL MCP Server
Provides comprehensive access to the Europa Component Library (ECL) design system with semantic search across 50+ components, code examples, accessibility requirements, design tokens, and validation tools for building European Commission websites.
README
EC Europa Component Library MCP Server
A Model Context Protocol (MCP) server that provides AI agents with access to the European Commission's Component Library documentation.
Features
- Full-text search across 159 documentation pages
- Structured data with categories and hierarchical paths
- Code examples extraction - 270 clean HTML examples from 85 pages
- Complete coverage of EC components, forms, media, navigation, utilities, and layouts
Installation
npm install
Usage
Add to your MCP client configuration (e.g., Claude Desktop):
{
"mcp": {
"ecl": {
"command": "npx",
"type": "stdio",
"args": [
"ecl-mcp"
]
}
}
}
Available Tools
about
Get information about this MCP server and what it provides.
search
Search the EC Europa Component Library documentation.
Parameters:
query(required): Search query to find relevant documentation pageslimit(optional): Maximum number of results to return (default: 10)
Returns:
- Page title
- URL
- Category
- Hierarchical path
- Content snippet with search term highlighted
get_page
Get the complete HTML content of a specific documentation page by URL.
Parameters:
url(required): The full URL of the page to retrieve (from search results)
Returns:
- Page title, URL, category
- Complete HTML content
get_examples
Get code examples from a specific documentation page by URL. Returns only the code blocks with their labels, making it faster than parsing full HTML.
Parameters:
url(required): The full URL of the page to retrieve examples from (from search results)
Returns:
- Page title, URL, category
- List of code examples with labels
- Clean HTML (syntax highlighting stripped)
Database
The server uses a SQLite database (ecl-database.sqlite) containing:
- 159 crawled documentation pages
- Full HTML content
- 270 extracted code examples from 85 pages
- Metadata (titles, categories, hierarchical paths)
- FTS5 full-text search index
Updating Documentation
To re-crawl the documentation:
node crawl.js
This will:
- Fetch any new URLs from
pages-to-crawl.txt - Update metadata for existing pages (without re-fetching HTML)
- Extract and store hierarchical path information
- Extract code examples and store them separately for fast retrieval
Example Workflow
1. Search for "table component"
2. Get examples: get_examples("https://ec.europa.eu/component-library/ec/components/table/code/")
3. Returns 5 clean HTML table examples with labels (Default, Zebra, Multi-header, Sort, Enhanced mobile)
License
ISC
Recommended Servers
playwright-mcp
A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.
Magic Component Platform (MCP)
An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.
Audiense Insights MCP Server
Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.
VeyraX MCP
Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.
Kagi MCP Server
An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.
graphlit-mcp-server
The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.
Qdrant Server
This repository is an example of how to create a MCP server for Qdrant, a vector search engine.
Neon Database
MCP server for interacting with Neon Management API and databases
Exa Search
A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.
E2B
Using MCP to run code via e2b.