Documentation

Add components

Use npx robloxui add to download component source files, install the theme package, and write files to your project.

1

Meet the prerequisites

  1. Node.js 20.12+

    Required to run the CLI. Check with `node --version`, or install from nodejs.org.

  2. Roblox Studio

    Required to open game.rbxl and press Play. Init generates game.rbxl when Rojo is available.

  3. mise

    The CLI bootstraps mise with the official installer when needed, then installs pinned Rojo and Wally from `mise.toml`.

  4. A Roblox project

    Run `npx robloxui init` to scaffold one, or use an existing project with rojo.json / wally.toml. Components install to src/client/ui/components/.

Existing project? You only need Node 20.12+ and a rojo.json or wally.toml — skip init and use npx robloxui add directly.

New to Roblox-TS? See the roblox-ts getting started guide.

2

Run the add command

No project yet? Run robloxui init first — see the add components guide. Then use npx to add any component by slug; the CLI writes files to src/client/ui/components/ (add --theme to also install the theme package).

bashnpx robloxui add <component-slug>
bashnpx robloxui add primary-button

Browse the catalog to find a slug, or copy the exact command from each component's detail page.

3

Let the CLI detect your project

The CLI scans your project root for a config file and picks the right install path automatically (the theme is opt-in per command):

Roblox-TSrojo.json + default.project.json

TypeScript compiled to Luau via rbxtsc. Init includes @rbxts/react and TSX sample UI; the theme is opt-in.

bashnpm install robloxui # optional robloxui/theme subpath
React-Luau (Wally)wally.toml + default.project.json

Pure Luau with Wally packages. robloxui add --theme vendors the bundled RuiTheme into Packages/.

bashrobloxui add <slug> --theme # vendors bundled RuiTheme

Default install path: src/client/ui/components/. If neither config file is found, the CLI prompts you to choose manually.

4

Use the component

Import the component the same way the CLI prints in its summary:

tsx
import { PrimaryButton } from "./ui/components/primary-button";