shadcn/ui logo

1 style v1.3.0

shadcn/ui is a set of accessible React components built on Radix UI and Tailwind CSS that you copy into your project with a CLI instead of installing a package.

Also known as shadcn, shadcn-ui, shadcn ui, shadcn CLI

Looks better on a light background

Preview
|
Usage
Install
npm i @dev.icons/react
Import
import { ShadcnUi } from "@dev.icons/react";
Render
<ShadcnUi size={32} />

Using an AI agent? Ask the Devicons MCP server for shadcn-ui, or fetch its JSON from the Icons API.

The shadcn/ui logo is two parallel diagonal strokes with rounded ends, one long and one short, in black. The slashes echo the slash in the project’s name.

The black strokes disappear on dark surfaces, so use the monochrome version in white there.

Use shadcn/ui in React component library comparisons, design system docs, Next.js starter templates and UI stack diagrams. It pairs naturally with Tailwind CSS, Radix UI, Next.js, React and v0.

Related icons