Elegant MCP Server

Elegant MCP Server

MCP server for the Elegant 1.0 design system that provides 12 tools for AI-assisted UI generation. It outputs single HTML files with CSS, JS, and assets served from CDN, requiring a GitHub token to fetch component documentation.

Category
Visit Server

README

Elegant Agent MCP Server

MCP server for the Elegant 1.0 UI component library. Provides 14 tools that give AI assistants everything they need to build Log360 Cloud pages — component HTML, page blueprints, shell skeletons, chart snippets, icons, and wiki documentation.

All data is served from the cloud. No local files needed.

Quick Setup

Cursor (recommended)

Add to .cursor/mcp.json in any project:

{
  "mcpServers": {
    "elegant-agent": {
      "url": "https://elegant-mcp.vercel.app/api/mcp"
    }
  }
}

Reload Cursor. 14 tools will appear.

Claude Desktop

Add to ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "elegant-agent": {
      "command": "npx",
      "args": ["-y", "mcp-remote", "https://elegant-mcp.vercel.app/api/mcp"]
    }
  }
}

Restart Claude Desktop.

Usage

Just ask the AI to build a page:

"Create Report Servers & Workstation - Windows - Windows Startup report page with all interactions"

The AI will automatically call the MCP tools in order:

  1. setup_project — gets CDN URLs and build rules
  2. get_page_blueprint — gets exact layout specification
  3. get_recipe / get_shell — gets shell skeleton
  4. get_component — gets HTML for each component
  5. Outputs a single index.html with all assets loaded from CDN

Available Tools (14)

Tool Description
setup_project CDN URLs, build rules, workflow steps
get_component Canonical HTML for any UI component
get_recipe Build recipe for Shell A/B/C/D
get_shell Complete HTML skeleton with CDN links
get_chart_snippet ElegantEChart HTML+JS code
get_checklist Pre-commit checklist
get_anti_patterns Known issues and fixes
list_components All available component names
search_wiki Full-text search across wiki docs
get_icons 195 SVG icon names with CDN URLs
get_full_wiki_file Complete wiki markdown file
get_topnavbar Complete TopNavBar HTML
get_page_blueprint Detailed page layout specification
get_screenshot Search 217 product screenshots

Recommended Servers

playwright-mcp

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.

Official
Featured
TypeScript
Magic Component Platform (MCP)

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.

Official
Featured
Local
TypeScript
Audiense Insights MCP Server

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.

Official
Featured
Local
TypeScript
VeyraX MCP

VeyraX MCP

Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.

Official
Featured
Local
graphlit-mcp-server

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.

Official
Featured
TypeScript
Kagi MCP Server

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.

Official
Featured
Python
E2B

E2B

Using MCP to run code via e2b.

Official
Featured
Neon Database

Neon Database

MCP server for interacting with Neon Management API and databases

Official
Featured
Exa Search

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.

Official
Featured
Qdrant Server

Qdrant Server

This repository is an example of how to create a MCP server for Qdrant, a vector search engine.

Official
Featured