Icons for Web
Quick Start

Quick Start with Hugeicons Free Icon Font

Get started quickly with Hugeicons Free Icon Font - a collection of 4,000+ high-quality stroke-rounded icons perfect for your web projects. This guide will help you set up and use our icon font in minutes.

Installation

The fastest way to get started is by using our CDN. Simply add this line to the <head> section of your HTML:

<link rel="stylesheet" href="https://cdn.hugeicons.com/font/hgi-stroke-rounded.css" />

This gives you instant access to our complete collection of 4,000+ free stroke-rounded icons, hosted on Google Cloud CDN for reliable performance.

Usage

Using icons is straightforward:

  1. Add the CDN link to your HTML head section
  2. Insert icons using the <i> tag with the appropriate class name
  3. Browse our icon collection to find the perfect icons for your project

Usage Example

Here's a complete example showing how to implement multiple icons:

<!DOCTYPE html>
<html>
<head>
    <title>Hugeicons Example</title>
    <meta charset="UTF-8" />
    <link rel="stylesheet" href="./styles.css" />
    <link rel="stylesheet" href="https://cdn.hugeicons.com/font/hgi-stroke-rounded.css" />
</head>
<body>
    <div class="icons">
        <ul>
            <li>
                <i class="hgi-stroke hgi-abacus"></i>
                <p>abacus</p>
            </li>
            <li>
                <i class="hgi-stroke hgi-absolute"></i>
                <p>absolute</p>
            </li>
            <li>
                <i class="hgi-stroke hgi-acceleration"></i>
                <p>acceleration</p>
            </li>
            <li>
                <i class="hgi-stroke hgi-access"></i>
                <p>access</p>
            </li>
        </ul>
    </div>
</body>
</html>
Hugeicons Font Example

Each icon is implemented using the hgi-stroke class combined with the specific icon class (e.g., hgi-abacus, hgi-absolute, etc.).

Features

  • 4,000+ Free Icons: Access our complete collection of stroke-rounded icons
  • Multiple Formats: Available in TTF, WOFF, WOFF2, EOT, and SVG formats for maximum compatibility
  • No Attribution Required: Free for both personal and commercial use
  • Google Cloud CDN: Fast and reliable delivery worldwide
  • Cross-Browser Support: Works seamlessly across all modern browsers

Available Formats

Hugeicons Free Icon Font supports multiple formats to ensure compatibility across different platforms and browsers:

  • WOFF2 (Primary format for modern browsers)
  • WOFF (Broad browser support)
  • TTF (TrueType Font)
  • EOT (For legacy IE support)
  • SVG (Vector format)

Looking for More?

While our free version offers 4,000+ high-quality icons, you can unlock even more possibilities with Hugeicons Pro:

  • Access to 37,000+ icons in 9 different styles
  • Cloudflare CDN for enhanced performance
  • Regular updates with new icons
  • Exclusive features and early access to new releases