Installation

Getting started with ProIcons doesn't take long. Follow the steps below for your environment:

• HTML
• HTML Webfont
• Node.js
• React
• Svelte
• Vue

HTML

Method 1: Use a CDN provider

The easiest way to install ProIcons is via a CDN provider such as UNPKG

<script src="https://unpkg.com/proicons"></script>

Method 2: Install locally

If you want to use ProIcons locally, you can also install ProIcons via NPM.

NPM

npm install proicons

Yarn

yarn add proicons

PNPM

pnpm add proicons

Bun

bun add proicons

Then import your proicons.js file in your HTML

<script src="path/to/proicons/dist/umd/proicons.cjs"></script>

Replace path/to/ with the actual path to your node_modules folder (relative to the HTML file).

Node.js

Install ProIcons from NPM:

NPM

npm install proicons

Yarn

yarn add proicons

PNPM

pnpm add proicons

Bun

bun add proicons

import { AddIcon } from 'proicons';

Or in CommonJS:

const proicons = require('proicons');
const { AddIcon } = proicons

HTML Webfont

If you prefer not to use any scripts, you can also install ProIcons as a webfont on your site.

Import via UNPKG

<link rel="stylesheet" href="https://unpkg.com/@proicons/webfont">

Install package via NPM

NPM

npm install @proicons/webfont

Yarn

yarn add @proicons/webfont

PNPM

pnpm add @proicons/webfont

Bun

bun add @proicons/webfont

<link rel="stylesheet" href="path/to/@proicons/webfont/ProIcons.css">

Read the documentation

React

Install via NPM:

NPM

npm install @proicons/react

Yarn

yarn add @proicons/react

PNPM

pnpm add @proicons/react

Bun

bun add @proicons/react

Read the documentation

Svelte

Install via NPM:

NPM

npm install @proicons/svelte

Yarn

yarn add @proicons/svelte

PNPM

pnpm add @proicons/svelte

Bun

bun add @proicons/svelte

Read the documentation

Vue

Install via NPM:

NPM

npm install @proicons/vue

Yarn

yarn add @proicons/vue

PNPM

pnpm add @proicons/vue

Bun

bun add @proicons/vue

Read the documentation