How to use Moeicons
There is no single mandatory workflow. Pick the entry point that matches how your project already consumes assets.
Browse, copy and download
Open the icon search page, search by name or keyword, and narrow the results by style group. Selecting an icon shows its variants, a ready-to-copy snippet and a download control. Free groups need no sign-in.
- Search by icon name, alias or keyword.
- Filter by style group.
- Copy a snippet or download the SVG.
Install the component package
The published moe-icons package is the quickest path for React and Vue. It ships the Moe Outline set as plain SVG components with no provider or build plugin.
- React: import { ArrowBoldRight } from 'moe-icons/react'.
- Vue: import { ArrowBoldRight } from 'moe-icons/vue'.
- Set the size with width and height; colour via the surrounding currentColor.
npm install moe-iconsGenerate components with the CLI
The CLI installs verified resources and generates local components for the target framework, so the icons live in your repository. It requires Node.js 22 or later. Free installation needs no account; Pro installation signs in and checks the entitlement.
- init writes moeicons.config.jsonc where you choose the target and icon IDs.
- Verified for Vite React/Vue and for Next.js App Router / Nuxt SSR generation.
- The generated components import from your project, not from the package.
npm install -D @moewolf/moe-icons-cli
npx moeicons init
npx moeicons install free
npx moeicons generate