Getting started

CLI

The NexUI CLI writes component source files directly into your project — you own every line from the moment it lands. No wrappers, no runtime dependency.


CLI is live — The @jessin/nexui package is published on npm. Run any command below and it will work immediately. Components are fetched from nexui.dev/api/registry and written directly into your project.

nexui init

Run once per project. Creates lib/utils.ts and injects the required CSS variables into globals.css.

bash
$ npx @jessin/nexui@latest init
Detecting project structure... Writing lib/utils.ts Adding CSS variables to globals.css  Done. NexUI is ready.

nexui add [component]

Copies a component into components/nexui/. The file is plain TypeScript — edit it however you like.

bash
$ npx @jessin/nexui@latest add button
Resolving button... Writing components/nexui/button.tsx  Done. Import: import { Button } from "@/components/nexui/button"

Add multiple components at once:

bash
$ npx @jessin/nexui@latest add button badge input card

nexui search [query]

Search components by name, tag, or category.

bash
$ npx @jessin/nexui@latest search calendar

nexui list

Prints every available component name.

bash
$ npx @jessin/nexui@latest list
Available components (57):  accordion alert auth-panel avatar badge button calendar card carousel chart checkbox code-block color-picker command data-table date-picker dialog dropdown ...

All 57 components

Pass any of these names to nexui add.

accordionalertauth-panelavatarbadgebuttoncalendarcardcarouselchartcheckboxcode-blockcolor-pickercommanddata-tabledate-pickerdialogdropdownfile-uploadforminputkanbanmodalmulti-selectnumber-inputotp-inputpaginationphone-inputpopoverprogressradiorange-sliderratingscroll-areasearchselectseparatorsheetskeletonsliderstepperswitchtabletabstag-inputtextareatimelinetoasttoggletoggle-grouptooltipview-switcherandroid-buttonios-buttondom-animationhover-toolbarhover-button-group

Package manager variants

npmnpx @jessin/nexui@latest add button
pnpmpnpm dlx @jessin/nexui@latest add button
yarnyarn dlx @jessin/nexui@latest add button
bunbunx @jessin/nexui@latest add button

No CLI needed — Every component is also available via copy-paste. Open the component library, click Code on any card, and paste the source into components/nexui/[name].tsx.

Related