---
title: "Tech Stack Icons for React"
seoTitle: "Tech Stack Icons for React npm Package — Installation & Usage"
description: "Original technology, framework and design-tool SVG icons as a typed React component."
date: "2026-10-24T12:00:00.000Z"
url: "https://www.npmjs.com/package/tech-stack-icons"
thumbnail: "/images/websites/tech-stack-icons.webp"
imageAlt: "Tech Stack Icons for React developer library website"
tagline: "Original technology, framework and design-tool SVG icons as a typed React component."
packageName: "tech-stack-icons"
packageVersion: "3.7.1"
packageFramework: "React"
category: ["npm packages"]
tags: ["npm", "React", "SVG icons", "developer tools", "tech-stack-icons"]
---

Use Tech Stack Icons to show technology stacks, frameworks, developer tools and design services in React. The component accepts a typed icon name and light, dark or grayscale variants.

## Install

```bash
npm install tech-stack-icons
```

Or use your preferred package manager:

```bash
pnpm add tech-stack-icons
yarn add tech-stack-icons
```

## Basic usage

```tsx
import StackIcon from "tech-stack-icons";

export default function Example() {
  return (
    <div style={{ width: 40, height: 40 }}>
      <StackIcon name="nextjs" variant="dark" />
    </div>
  );
}
```

## Compatibility

React and React DOM 18.2 or 19, as declared by the published package. The version checked for this page is **3.7.1**. The [npm package page](https://www.npmjs.com/package/tech-stack-icons) lists the latest release, README and full API.

## Explore the library

[Browse Tech Stack Icons](https://www.tech-stack-icons.com/) to explore available icon names and variants.

[Explore the related website](/websites/tech-stack-icons/), or [browse all Plus UI npm packages](/npm-packages/).