Lucide Icons MCP
The Lucide Icons MCP server allows AI tools and applications to access and utilize Lucide icons for search, discovery, and implementation. It provides access to all 1,500+ Lucide icons with proper JSX usage examples.
Key capabilities:
Search Icons: Find icons by name or category using partial matching
Filter Icons: Filter search results by specific category
Fuzzy Search: Perform fuzzy searches for icons and categories by name
List Categories: View all available icon categories with their icon counts
List by Category: See all icons within a specific category
Usage Examples: Retrieve React/JSX usage examples for specific icons
Dual Mode: Supports both HTTP and stdio-based MCP server modes
Integration: Compatible with MCP clients like Claude Desktop for seamless icon integration
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., "@Lucide Icons MCP search for a download icon"
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.
lucide-icons-mcp
A Model Context Protocol (MCP) server exposing Lucide React icons as resources and tools for LLMs and agentic applications. Built with Bun and the MCP TypeScript SDK.
What is Lucide?
Lucide is a beautiful & consistent icon toolkit made by the community. It's an open-source icon library that provides over 1,500+ carefully crafted icons in a single, consistent style. Originally forked from Feather Icons, Lucide has grown into one of the most popular icon libraries for modern web development.
Related MCP server: Hugeicons
What is MCP?
The Model Context Protocol (MCP) is a standard for AI tools to request specific context from sources outside their main training data.
This MCP server allows AI coding assistants and other agentic applications to access information about Lucide React icons, enabling better assistance with icon search, discovery, and implementation.
Features
🔍 Icon Search: Search through 1,500+ Lucide icons by name or category
📂 Category Browsing: List icons by categories (Design, Communication, Media, etc.)
💡 Usage Examples: Get React/JSX code examples for any icon
🔧 Icon Information: Detailed information about each icon
🚀 MCP Integration: Ready for Claude Desktop and other MCP clients
🌐 Dual Mode: HTTP server or stdio-based MCP server
📊 Comprehensive Coverage: All Lucide icons with proper JSX usage
Prerequisites
Getting Started (Development)
1. Clone the repository
git clone https://github.com/SeeYangZhi/lucide-icons-mcp.git
cd lucide-icons-mcp2. Install Bun (if you don't have it)
Refer to the official Bun installation guide.
After installation, restart your terminal and check:
bun --version3. Install dependencies
bun install4. Build the project
This compiles the TypeScript source to JavaScript in the build directory.
bun run buildUsage
HTTP Mode
You can run the HTTP server using npx:
npx lucide-icons-mcpThis starts the HTTP server (defaults to port 3000).
Or install globally:
npm install -g lucide-icons-mcpThen run:
lucide-icons-mcpStdio Mode
npx lucide-icons-mcp --stdio
# or if installed globally
lucide-icons-mcp --stdioLocal Development
There are two main ways to run the MCP server:
1. HTTP Mode
Suitable for clients that support communication over HTTP.
For development (using Bun):
bun run start
# or directly
bun run src/entry.ts2. Stdio Mode
Often used for direct integration with tools like Claude Desktop or the MCP Inspector.
For development (using Bun):
bun run src/entry.ts --stdioConfiguration with AI Tools
Example: Claude Desktop
To use this MCP server in Claude Desktop:
Open your Claude Desktop configuration file:
code ~/Library/Application\ Support/Claude/claude_desktop_config.jsonAdd the server to the
mcpServerssection:
Option A: via npx (Recommended):
{
"mcpServers": {
"lucide-icons": {
"command": "npx",
"args": ["lucide-icons-mcp", "--stdio"]
}
}
}Option B: Pointing directly to the build output:
{
"mcpServers": {
"lucide-icons": {
"command": "node",
"args": ["/ABSOLUTE/PATH/TO/lucide-icons-mcp/build/entry.js", "--stdio"]
}
}
}Save the file and restart Claude Desktop.
You should now see the "lucide-icons" server available in Claude's tools panel.
Tools Available (MCP)
This MCP server exposes the following tools to AI coding assistants. Each icon can belong to multiple categories, providing flexible search and discovery capabilities.
1. search_icons
Description: Search for Lucide icons by name or category. Returns icons with their complete category arrays.
Parameters:
query(string): Search term for icon name or categorycategory(optional string): Filter by specific categorylimit(optional number): Maximum results to return
Returns: Array of icons with
nameandcategories(string array)
2. search_categories
Description: Search for icon categories by category name using partial matching
Parameters:
query(string): Search term for category namelimit(optional number): Maximum results to return
Returns: Array of categories with
nameandiconCount
3. fuzzy_search_icons
Description: Fuzzy Search for icons from lucide by icon name
Parameters:
query(string): Search term for iconlimit(optional number): Maximum results to return
Returns: Array of icons with
nameandcategories(string array)
4. fuzzy_search_categories
Description: Fuzzy Search for icon categories by category name
Parameters:
query(string): Search term for category namelimit(optional number): Maximum results to return
Returns: Array of categories with
nameandiconCount(string array)
5. get_icon_usage_examples
Description: Get usage examples for a Lucide React icon by the exact name
Parameters:
name(string): Search term for icon
Returns: React/JSX usage examples for a specific Lucide icon
6. list_all_icons_by_category
Description: List all icons in a specific category
Parameters:
category(string): Category name to list icons forlimit(optional number): Maximum results to return
7. list_all_categories
Description: List all available icon categories with their icon counts
Example Usage
Here's how an AI tool might use this MCP server:
Example 1: Finding Icons
User: "Find me icons related to ArrowRight"
AI tool calls search_icons:
{
"query": "ArrowRight",
"limit": 5
}Response: Lists icons like ArrowRight
Example 2: Getting Usage Examples
User: "Show me how to use the ArrowRight icon"
AI tool calls get_icon_usage_examples:
{
"name": "ArrowRight"
}Response:
import { ArrowRight } from "lucide-react";
function Example() {
return (
<div>
<ArrowRight />
</div>
);
}Example 3: Browsing Categories
User: "What design-related icons are available?"
AI tool calls search_categories:
{
"query": "design"
}Then calls list_icons_by_category":
{
"category": "Design",
"limit": 10
}Icon Categories
Lucide icons are organized into categories such as:
Accessibility
Accounts & access
Animals
Arrows
Brands
Buildings
Charts
Communication
Connectivity
Cursors
Design
Coding & development
Devices
Emoji
File icons
Finance
Food & beverage
Gaming
Home
Layout
Mail
Mathematics
Medical
Multimedia
Nature
Navigation
Notification
People
Photography
Science
Seasons
Security
Shapes
Shopping
Social
Sports
Sustainability
Text formatting
Time & calendar
Tools
Transportation
Travel
Weather
Testing MCP Locally with Inspector
You can test the MCP server locally using the MCP Inspector.
First, ensure the project is built:
bun run buildThen launch the Inspector:
npx @modelcontextprotocol/inspector node ./build/entry.js --stdioThis opens the Inspector interface for interactive testing of your MCP server.
Development Scripts
bun run dev: Starts the server in HTTP mode for developmentbun run dev:stdio: Starts the stdio MCP server for developmentbun run build: Compiles TypeScript to JavaScript (output inbuild/)bun run lint: Lints the codebase using ESLintbun run lint:fix: Automatically fixes linting issuesbun run crawl: Crawls Lucide website to update icon databun run pre-build: Crawls data, builds icon metadata, and fixes linting
Data Sources
This project includes a web crawler that automatically extracts icon information from the Lucide website, ensuring up-to-date icon data and categories.
Resources
Lucide - The icon library
Lucide React - React implementation
Model Context Protocol - MCP specification
MCP TypeScript SDK - SDK used
MCP Inspector - Testing tool
Bun - JavaScript runtime
License
This project is licensed under the MIT License. See LICENSE for details.
This project references icons from Lucide (https://lucide.dev/), which are licensed under their ISC License:
ISC License
Copyright (c) for portions of Lucide are held by Cole Bemis 2013-2022 as part of Feather (MIT). All other copyright (c) for Lucide are held by Lucide Contributors 2022.
Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
Available Tools
7 toolsfuzzy_search_categoriesC
Fuzzy Search for icon categories by category name
Inputs: query (required), limit.
fuzzy_search_iconsB
Fuzzy Search for icons from lucide by icon name
Inputs: query (required), limit.
get_icon_usage_examplesC
Get usage examples for a Lucide React icon
Inputs: name (required).
list_all_categoriesA
List all available icon categories with their icon counts
Inputs: no named parameters.
list_all_icons_by_categoryC
List all icons in a specific category
Inputs: category (required), limit.
search_categoriesB
Search for icon categories by category name using partial matching
Inputs: query (required), limit.
search_iconsB
Search for icons from lucide by name or category using partial matching
Inputs: query (required), category, limit.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
Loading tool schema changelog…
TDQS
Scored across 7 tools
There is significant overlap between fuzzy_search_categories and search_categories (both search categories by name, just with different matching algorithms), and between fuzzy_search_icons and search_icons (both search icons, with fuzzy vs partial matching). This creates ambiguity about which tool to use for similar tasks. However, the other tools (get_icon_usage_examples, list_all_categories, list_all_icons_by_category) have distinct purposes.
All tools follow a consistent snake_case naming pattern with clear verb_noun structure (e.g., fuzzy_search_categories, list_all_categories, get_icon_usage_examples). The naming is predictable and readable throughout the set, with no deviations in style or convention.
With 7 tools, the count is well-scoped for an icon library server, allowing coverage of categories, icons, and usage examples. It's slightly on the higher side due to redundant search tools, but overall reasonable and not excessive for the domain.
The tool set covers key operations for an icon library: listing categories and icons, searching icons and categories, and getting usage examples. There are minor gaps, such as no tool for getting detailed icon metadata (e.g., SVG data or tags) or managing icons, but core workflows for discovery and usage are well-covered.
Maintenance
Related MCP Connectors
Iconify MCP — wraps the Iconify public API (free, no auth)
Search 324k icons or generate new ones in the Lucide grammar - grammar-locked lint+critique+repair
Bundlephobia MCP — npm bundle-size analysis
DiceBear MCP — wraps DiceBear Avatar API v7 (free, no auth)
Related MCP Servers
- AlicenseAqualityDmaintenanceheroicons-mcp is a Model Context Protocol (MCP) server that exposes Heroicons. It allows LLMs and agentic applications to search, list, and generate usage examples of icons in React applications.311 npmMIT
- 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 gradedqualityDmaintenanceAI-powered SVG icon generation MCP server. Generate production-ready SVG icons from text descriptions with customizable styles, sizes, and themes.93 npm8MIT
- AlicenseAqualityDmaintenanceAn MCP server that provides Lucide icons as SVG, allowing clients to list, search, and retrieve icons by name.36 npmMIT