Hugeicons MCP

🚀 Hugeicons MCP Server

An MCP server for Hugeicons integration and documentation

This is a TypeScript-based MCP server that provides tools and resources to help integrate Hugeicons into various platforms. It implements a Model Context Protocol (MCP) server to assist AI assistants in providing accurate guidance for using Hugeicons.

✨ Features

Tools

• list_icons - Get a list of all available Hugeicons icons.
• search_icons - Search for icons by name or tag.
• get_platform_usage - Get platform-specific usage instructions.

Resources

Platform documentation (in Markdown format):

• hugeicons://docs/platforms/react - React integration guide.
• hugeicons://docs/platforms/vue - Vue integration guide.
• hugeicons://docs/platforms/angular - Angular integration guide.
• hugeicons://docs/platforms/svelte - Svelte integration guide.
• hugeicons://docs/platforms/react-native - React Native integration guide.
• hugeicons://docs/platforms/flutter - Flutter integration guide.

Icon data:

• hugeicons://icons/index - Complete index of all Hugeicons (in JSON format).

Functionality

This server provides comprehensive support for Hugeicons integration, including:

• Icon discovery and search.
• Platform-specific installation instructions.
• Usage example code snippets.
• Component property documentation.
• Package installation instructions.

🚀 Quick Start

You can also run the server directly using npx:

npx @hugeicons/mcp-server

📦 Installation

Installation via Smithery

To automatically install the Hugeicons MCP server for use with Claude Desktop via Smithery:

npx -y @smithery/cli install @hugeicons/mcp-server --client claude

To use it with Claude Desktop, add the server configuration:

On MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json On Windows: %APPDATA%/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "hugeicons": {
      "command": "npx",
      "args": [
        "-y",
        "@hugeicons/mcp-server"
      ]
    }
  }
}

The argument array specifies:

1. -y: Automatically answer "yes" to npx prompts.
2. Package name: @hugeicons/mcp-server.

Debugging

Since the MCP server communicates via stdio, debugging can be challenging. We recommend using MCP Inspector, which is available as a package script:

npm run inspector

The Inspector will provide a URL to access the debugging tools in the browser.

🔧 Development

Install dependencies

npm install

Build the server

npm run build

Development with automatic rebuild

npm run watch