@iconz/iconz

Beautiful, lightweight SVG icon library optimized for CDN distribution. 1000+ production-ready icons with zero dependencies.

Features

✨ 1000+ Icons - Comprehensive icon collection
⚡ Lightweight - ~50KB minified
🎨 Customizable - Size, color, stroke width
🚀 No Dependencies - Pure vanilla JavaScript
📦 CDN Ready - jsDelivr & unpkg support

Quick Start

Via CDN

<script src="https://cdn.jsdelivr.net/npm/@iconz/iconz@1.0.1/dist/iconz.min.js"></script>

<!-- Use icons -->
<i iconz="heart"></i>
<i iconz="search" size="24"></i>
<i iconz="settings" color="red"></i>

Usage of icons

<i iconz="heart"></i>
<i iconz="search" size="24"></i>
<i iconz="settings" color="red"></i>

Via NPM

npm install @iconz/iconz

import { renderIcon } from '@iconz/iconz';

const icon = renderIcon('heart', { size: 32, color: 'red' });
document.body.appendChild(icon);

Usage

HTML Attributes

<!-- Basic -->
<i iconz="heart"></i>

<!-- With size -->
<i iconz="heart" size="32"></i>

<!-- With color -->
<i iconz="search" size="24" color="blue"></i>

<!-- With stroke width -->
<i iconz="star" size="40" stroke="2"></i>

<!-- Combined -->
<i iconz="download" size="32" color="#667eea" stroke="2"></i>

JavaScript API

const { renderIcon, getIcon } = window.iconz;

// Render icon
const icon = renderIcon('heart', { size: 24, color: 'red' });
document.body.appendChild(icon);

// Get icon data
const data = getIcon('heart');

With Tailwind CSS

<i iconz="heart" size="24" class="text-red-500"></i>
<i iconz="download" size="20" class="text-blue-600"></i>

API Reference

renderIcon(name, options)

renderIcon('heart', {
  size: 24,           // Icon size in pixels
  color: 'red',       // Icon color
  stroke: 2,          // Stroke width
  className: ''       // CSS classes
});
// Returns: SVGElement

getIcon(name)

Get icon data without rendering.

const data = getIcon('heart');

Icon Names

All icons use kebab-case naming:

heart, star, search, settings, download, upload
arrow-up, arrow-down, arrow-left, arrow-right
check, x, plus, minus, trash, bell, menu
... 1000+ more icons

See cdn-example.html for interactive preview.

License

MIT © 2026 devchauhann

All icons are free for commercial use.

Support

• 📚 Documentation
• 🐛 Issues
• 🎨 Preview

Built with ❤️ by devchauhann