Open Source Component Library

Build Beautiful UIs,
the Dope Way.

A lightweight library for React developers. Prebuilt components, templates, and utilities — crafted for real-world UI patterns.

How it works

Three steps. That's it.

01

Install

One command. No config files, no wrappers, no providers.

npm i nitro-icons-react
02

Import

Grab only the icons you need. Everything else is tree-shaken.

import { Home } from '...'
03

Use

Drop it in your JSX. Customize size, stroke, and color inline.

<Home size={24} />
Features

Why Nitro Icons?

Tree-shakeable

Each icon is its own module. Your bundler drops the rest.

TypeScript

Full type definitions. IntelliSense for every single prop.

Customizable

Size, stroke width, color — inline props, no CSS needed.

Pixel Perfect

24x24 grid. Crisp at every size, on every screen.

Auto-generated

Add an SVG, run one command. Components are rebuilt instantly.

Open Source

MIT license. Use it anywhere, forever, for free.

Library

23+ icons and counting

Consistent, clean, and designed to work together.

Quick start

Up and running
in seconds

Install the package, import what you need, and start building. No config, no setup, no boilerplate.

Get started
terminal
$ npm install nitro-icons-react
App.jsx
import { Home } from "nitro-icons-react";

<Home
  size={24}
  strokeWidth={2}
  className="text-pink-500"
/>

Ready to build?

Free, open source, and designed to make your UI better. Start using Nitro Icons today.