Home Documentation

Getting Started

Welcome to Iconfyra. Add 2,000+ beautifully crafted icons to your project in under a minute. No build tools required -- just include a stylesheet and start using icon classes.

Quick Start with CDN #

The fastest way to get started is with our CDN. Add this single line to your HTML <head>:

<link rel="stylesheet"
      href="https://cdn.iconfyra.com/1.0.0/css/all.min.css">

Then use any icon in your HTML:

<!-- Solid style (default) -->
<i class="icf-solid icf-house"></i>

<!-- Regular style -->
<i class="icf-regular icf-envelope"></i>

<!-- With sizing -->
<i class="icf-solid icf-star icf-2x"></i>

That's it! A style class (like icf-solid) and the icon name class gives you a pixel-perfect icon.

Choose Your Method #

There are three ways to use Iconfyra in your project. Choose the one that fits best:

Download Package #

If you prefer to self-host, you can download the complete icon package:

  • Free Package — includes Solid and Regular weights (2,000+ icons)
  • Pro Package — includes all 5 weights: Solid, Regular, Light, Thin, and Duotone

Visit the Downloads page to get the latest package, or follow the Self-Hosting guide for step-by-step instructions.

Get an API Key #

To use the Iconfyra API for searching icons, retrieving SVGs, or building custom integrations, you need an API key.

  1. Create a free account (or log in)
  2. Go to your Dashboard → API Keys
  3. Click Generate New Key
  4. Copy the key and include it in your API requests
// Include your API key in the Authorization header
const response = await fetch('https://api.iconfyra.com/v1/icons?q=house', {
    headers: {
        'Authorization': 'Bearer icf_live_your_api_key_here'
    }
});

Free accounts get 10,000 API calls per month. Need more? Upgrade to Pro for 1,000,000 calls/month.

Available Icon Styles #

Every icon in Iconfyra is available in up to 5 weights. The style you choose affects the visual thickness and fill of the icon.

Style Class Description Plan
Solid icf-solid Filled icons, great for primary actions Free
Regular icf-regular Outlined icons, perfect for UI elements Free
Light icf-light Thinner outlines for a delicate look PRO
Thin icf-thin Ultra-thin lines for minimalist designs PRO
Duotone icf-duotone Two-layer icons with primary and secondary colors PRO