remix-icon

Provide 3,100+ neutral-style icons in outlined and filled variants.

2.2k|422|Updated Oct 23, 2025

Search Tags:#react #front-end #vue #webfonts #icons #svg #ui design

One-click install

npx skills add https://github.com/mrgoonie/claudekit-skills --skill remix-icon

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: remix-icon
Source: https://github.com/mrgoonie/claudekit-skills/tree/main/.claude/skills/remix-icon
Command: npx skills add https://github.com/mrgoonie/claudekit-skills --skill remix-icon

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires remixicon, @remixicon/react, @remixicon/vue.

What problem does it solve?

Finding consistent, high-quality icons for UI design and development can be a challenge, often leading to fragmented visual styles. This skill provides a comprehensive library of 3,100+ neutral-style icons in both outlined and filled variants, ensuring visual consistency and speeding up UI development.

Core Features & Use Cases

Dual Styles: Access icons in both line (outlined) and fill (filled) styles for versatile design.
Easy Integration: Use with webfonts, SVG, React, Vue, or directly in design tools.
Semantic Categories: Quickly find the right icon across 20 organized categories.
Use Case: Rapidly build a navigation menu with visually consistent icons, easily switching between outlined icons for inactive states and filled icons for active states.

Quick Start

1. Install via NPM:

npm install remixicon

2. Link CSS in your project (e.g., in index.html or main CSS file):

<link href="node_modules/remixicon/fonts/remixicon.css" rel="stylesheet" />

3. Use in HTML: