hugeicons-proxy

A lightweight React helper for Hugeicons. Import once and use any icon as a React component by name. No manual imports, no icon mapping, full TypeScript support and autocomplete.

Why this exists

Hugeicons ships icons as data. This package turns every icon into a ready to use React component with a single export.

Installation

# Using npm
npm install hugeicons-proxy

# Using yarn
yarn add hugeicons-proxy

# Using pnpm
pnpm add hugeicons-proxy

# Using bun
bun add hugeicons-proxy

Usage

import { Icons } from "hugeicons-proxy";

function MyComponent() {
  return (
    <Icons.HugeiconsIcon
      size={20}
      strokeWidth={1.5}
      className="text-muted-foreground"
      // {...props}
    />
  );
}

How it works

Icon is a Proxy. Property access resolves an icon definition at runtime and returns a React Component. Types ensure autocomplete and correct props.

Notes: Works with ESM, no per icon imports and is built for TypeScript first.

Props

These props pass straight to HugeiconsIcon. The icon prop is handled internally by the proxy and never required from you.

Prop	Type	Default	Description
icon	IconType	Required	The main icon to display
altIcon	IconType	-	Alternative icon that can be used for states, interactions, animations, or dynamic icon swapping
showAlt	boolean	false	When true, displays the altIcon instead of the main icon
size	number	24	Icon size in pixels
color	string	currentColor	Icon color (CSS color value)
primaryColor	string	currentColor	Primary color for multicolor icons (Bulk, Duotone, Twotone styles)
secondaryColor	string	-	Secondary color for multicolor icons (Bulk, Duotone, Twotone styles)
disableSecondaryOpacity	boolean	false	When true, disables the default opacity applied to the secondary color
strokeWidth	number	1.5	Width of the icon strokes (works with stroke-style icons)
className	string	-	Additional CSS classes

Icons are selected by property name, not by props.

Example.

<Icons.SearchIcon size={20} />
<Icons.PlusSignIcon primaryColor="#0ea5e9" />

This keeps usage simple and prevents invalid icon values at runtime.

License

MIT