@moamfar/icon-pack

A collection of beautiful, weight-adjustable SVG icons.

✨ Features

• 🎨 4 Style Weights: Outline, Fill, Broken, Duotone
• 🌳 Tree-shakable: Import only what you use
• 🧠 Fully Typed: TypeScript definitions included
• ⚡ Zero Dependencies: Lightweight and fast
• 🎯 React 16.8+ Compatible

📦 Installation

npm install @moamfar/icon-pack

or

yarn add @moamfar/icon-pack

🚀 Quick Start

import { Heart, Star, User } from "@moamfar/icon-pack";

function App() {
  return (
    <div style={{ display: "flex", gap: 16 }}>
      <Heart size={32} color="red" weight="broken" />
      <Star size={24} />
      <User size={48} color="#4f46e5" weight="fill" />
    </div>
  );
}

🧩 Props

| Prop | Type | Default | Description | | ---------- | ---------------------------------------------- | ---------------- | -------------------------- | | size | number | 24 | Width & height of the icon | | color | string | "currentColor" | Stroke / fill color | | weight | "fill" \| "broken" \| "outline" \| "duotone" | "outline" | Icon style variant | | ...props | SVGProps<SVGSVGElement> | — | Standard SVG props |

🎨 Weight Variants

Each icon includes:

• Outline — Clean line style
• Fill — Solid filled style
• Broken — Stylized stroke design
• Duotone — Two-layer tone styling

🗂 Available Icons

Icons Preview

📄 License

MIT © 2026 moamfar