Hugeicons MCP Server
Provides platform-specific usage instructions and integration guides for using Hugeicons in Angular applications.
Provides platform-specific usage instructions and integration guides for using Hugeicons in Flutter applications.
Provides platform-specific usage instructions and integration guides for using Hugeicons in React applications.
Provides platform-specific usage instructions and integration guides for using Hugeicons in Svelte applications.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Hugeicons MCP Servershow me how to use Hugeicons in React"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Hugeicons MCP Server
MCP server for Hugeicons integration and documentation
This is a TypeScript-based MCP server that provides tools and resources for integrating Hugeicons into various platforms. It implements a Model Context Protocol (MCP) server that helps AI assistants provide accurate guidance for using Hugeicons.
Features
Tools
list_icons- Get a list of all available Hugeicons iconssearch_icons- Search for icons by name or tagsget_platform_usage- Get platform-specific usage instructions for Hugeicons
Resources
Platform Documentation (in Markdown format):
hugeicons://docs/platforms/react- React integration guidehugeicons://docs/platforms/vue- Vue integration guidehugeicons://docs/platforms/angular- Angular integration guidehugeicons://docs/platforms/svelte- Svelte integration guidehugeicons://docs/platforms/react-native- React Native integration guidehugeicons://docs/platforms/flutter- Flutter integration guide
Icons Data:
hugeicons://icons/index- Complete index of all Hugeicons (JSON format)
Functionality
This server provides comprehensive Hugeicons integration support including:
Icon discovery and search
Platform-specific installation guides
Usage examples with code snippets
Component props documentation
Package installation instructions
Related MCP server: Better Icons
Development
Install dependencies:
npm installBuild the server:
npm run buildFor development with auto-rebuild:
npm run watchInstallation
Installing via Smithery
To install Hugeicons MCP Server for Claude Desktop automatically via Smithery:
npx -y @smithery/cli install @hugeicons/mcp-server --client claudeTo use with Claude Desktop, add the server config:
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 args array specifies:
-y: Automatically answer "yes" to npx promptsPackage name:
@hugeicons/mcp-server
Quick Start
You can also run the server directly using npx:
npx @hugeicons/mcp-serverDebugging
Since MCP servers communicate over stdio, debugging can be challenging. We recommend using the MCP Inspector, which is available as a package script:
npm run inspectorThe Inspector will provide a URL to access debugging tools in your browser.
Available Tools
3 toolsget_platform_usageB
Get platform-specific usage instructions for Hugeicons
| Name | Required | Description | Default |
|---|---|---|---|
| platform | Yes | Platform name (react, vue, angular, svelte, react-native, flutter) |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full disclosure burden. It implies a read-only documentation lookup by saying 'Get... instructions', but it does not state the return format, whether it is static or fetched, or any behavioral traits. Minimal behavioral context.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
A single, front-loaded sentence with no wasted words. It communicates the action and resource efficiently.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a one-parameter lookup tool with no output schema, the description is adequate but thin: it does not indicate what the usage instructions contain or what the response looks like. It is enough to select the tool, but leaves gaps about the return payload.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema description coverage is 100% and the single platform parameter is fully documented with an enum in the schema. The description adds no syntax or meaning beyond what the schema already provides, so the baseline 3 applies.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description states a specific verb+resource (get platform-specific usage instructions) and scopes it to Hugeicons, which clearly distinguishes it from the icon-listing/searching siblings. It does not explicitly name the siblings, but the purpose is unambiguous.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
There is no guidance on when to use this tool versus list_icons or search_icons, nor any mention of prerequisites or exclusions. An agent must infer that this is for retrieving setup/usage docs rather than icon data.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
list_iconsB
Get a list of all available Hugeicons icons
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It states the action but doesn't add context about what 'all available' entails (e.g., pagination, rate limits, authentication needs, or response format). This leaves significant gaps for a tool that likely returns a large dataset.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that directly states the tool's purpose without any fluff. It's front-loaded and appropriately sized for a simple tool, earning its place with zero waste.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity (a list operation with no output schema) and lack of annotations, the description is incomplete. It doesn't address behavioral aspects like response format, data volume, or potential limitations, which are crucial for an agent to use this tool effectively.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 0 parameters with 100% coverage, so no parameter documentation is needed. The description appropriately doesn't discuss parameters, aligning with the schema. A baseline of 4 is applied since it doesn't add unnecessary information.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the verb 'Get' and the resource 'list of all available Hugeicons icons', making the purpose specific and understandable. However, it doesn't explicitly differentiate from sibling tools like 'search_icons' or 'get_icon_glyphs', which prevents a perfect score.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like 'search_icons' or 'get_icon_glyphs'. It lacks context about use cases, prerequisites, or exclusions, leaving the agent with minimal direction.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
search_iconsB
Search for icons by name or tags. Use commas to search for multiple icons (e.g. 'home, notification, settings')
| Name | Required | Description | Default |
|---|---|---|---|
| query | Yes | Search query to find relevant icons. Separate multiple searches with commas |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It describes the search functionality but lacks details on behavioral traits such as whether the search is case-sensitive, how results are returned (e.g., pagination, format), rate limits, or error handling. The description adds minimal context beyond the basic action, leaving gaps in understanding how the tool behaves.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is concise and well-structured in two sentences: the first states the purpose, and the second provides usage guidance with an example. Every sentence earns its place by adding clarity and practical information without unnecessary details, making it front-loaded and efficient.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's moderate complexity (a search function with one parameter) and no output schema or annotations, the description is adequate but incomplete. It covers the basic purpose and parameter usage but lacks details on output format, error cases, or integration with sibling tools. For a search tool without structured output information, more context on what to expect from results would improve completeness.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, with the 'query' parameter documented as 'Search query to find relevant icons. Separate multiple searches with commas.' The description adds value by providing an example ('e.g., 'home, notification, settings'') that clarifies the format for multiple searches, but it does not significantly expand on the schema's semantics. With high schema coverage, the baseline is 3, as the description compensates slightly but not substantially.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Search for icons by name or tags.' It specifies the verb ('Search') and resource ('icons'), and mentions the search criteria ('by name or tags'). However, it does not explicitly differentiate from sibling tools like 'list_icons' or 'get_icon_glyphs', which might offer alternative ways to retrieve icons.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides implied usage guidance by mentioning how to search for multiple icons ('Use commas to search for multiple icons'), which suggests this tool is for filtered searches. However, it does not explicitly state when to use this tool versus alternatives like 'list_icons' (which might list all icons without filtering) or 'get_icon_glyphs' (which might retrieve specific icon data). No exclusions or clear alternatives are named.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
3 tool updates
v0.1.2- First observed
get_platform_usage - First observed
list_icons - First observed
search_icons
TDQS
Scored across 3 tools
list_icons and search_icons overlap in that both enumerate icons, but the distinction (full catalog vs. filtered query) is clear from descriptions. get_platform_usage is entirely distinct, so boundaries are largely unambiguous.
All three tools follow a clean verb_noun snake_case pattern (list_icons, search_icons, get_platform_usage). The convention is predictable and consistent throughout.
Three tools is lean but defensible for an icon-lookup server covering browse, search, and integration guidance. It borders on thin, as a dedicated icon-detail tool would round it out.
Core discovery (list, search) and integration help are present, but there is no tool to fetch a specific icon's full metadata, SVG source, or download/install instructions. Notable gaps remain for a full icon lifecycle.
Maintenance
Related MCP Connectors
Icons for agentic development: search & fetch 366,000+ open-source icons as SVG/PNG. No API key.
320K+ open-source SVG icons: 12 tools, anonymous metadata search; SVG, exports, collections via Pro.
Search 161,000+ free icons; get SVG (single/bulk), PNG, related icons, webfont classes. No API key.
Multilingual semantic SVG icon search with previews for AI coding agents. 20,000+ icons.
Related MCP Servers
- AlicenseBqualityDmaintenanceHugeicons MCP Server is a TypeScript based server that provides integrated tools and resources for the Hugeicons icon library, supporting icon search, retrieval, and usage guides for multiple platforms.52Apache 2.0
- AlicenseNot gradedqualityCmaintenanceProvides access to over 200,000 icons from 150+ collections with features for searching, recommendations, and direct file synchronization. It supports multiple frameworks and optimizes AI performance by writing icon code directly to project files.457 npm1,273MIT
- AlicenseNot gradedqualityDmaintenanceProvides access to over 200,000 open-source vector icons from more than 200 icon sets via the Iconify API. It enables users to browse, search, and retrieve specific icon data along with usage examples for popular web frameworks like React, Vue, and Tailwind CSS.256 npm15GPL 3.0
- AlicenseAqualityDmaintenanceProvides access to Iconify's 200,000+ open source vector icons from 200+ icon sets, enabling search, browsing, and retrieval of icon data with framework usage examples.44 npmMIT