Icon

Logo

use

Getting Started

Welcome to the Iconweuse Getting Started guide. Whether you're a designer looking for static assets or a developer building complex web applications, we have the tools to help you integrate high-quality icons in seconds.

Our goal is to make icon implementation as smooth as possible through multiple distribution channels: CDN, NPM, and direct downloads.

Quick Start

The fastest way to get up and running is by using our optimized CDN or by directly copying SVG code from our icon library.

1. Using Direct SVGs

Direct SVG integration is the most flexible approach for developers who need maximum control over styling and performance.

Step 1: Copy SVG Code

Browse the Icon Library, select the icon you need, and click on "Copy SVG." The code will be instantly copied to your clipboard.

Step 2: Paste into your Project

Paste the code directly into your HTML, JSX, or Vue templates. You can then style it using standard CSS or utility classes like Tailwind CSS.


<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor">
  <path d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/>
</svg>

2. Using the CDN

Our CDN is the easiest way to add the entire Iconweuse library to your website. It provides access to our custom-built icon font.

Step 1: Add CDN Link

Paste the following line into the <head> section of your HTML file:

<link href="https://cdn.iconweuse.com/cdn/icon/k4z9rm2tq1" rel="stylesheet" />

Step 2: Add Icons via CSS Classes

Once the CDN is linked, you can use any icon by adding a simple <i> tag with the appropriate classes.

<i class="iwu-breeze iwu-regular iwu-search"></i>

3. Using NPM (Recommended for Apps)

For React, Vue, or modern Javascript applications, we recommend installing our package via NPM or Yarn.

npm install iconweuse

After installation, you can import and use icons directly as components or import the CSS globally.

4. Local Download

Want to host the assets yourself? You can download the complete Iconweuse package from your account dashboard.

  • Download the ZIP from the Download Portal.
  • Extract the files and copy the `css` and `fonts` folders to your project.
  • Link the local `iconweuse.css` file in your HTML.