CLI Tool
Discover how to use the MelonUI CLI to quickly add components to your codebase.
Installation & Execution
You can run the MelonUI CLI tool globally on your system, or execute it dynamically on-demand using npx.
1. Global Installation
Install once globally to access the command directly as melonui:
npm install -g @melonui-dev/cli
Once installed, run any command prefixing with melonui (e.g. melonui init).
2. Dynamic Execution
Run directly using npx without a global installation:
npx @melonui-dev/cli [command]
Useful for environments where you don't want to maintain global node_modules dependencies.
Interactive Modes
MelonUI provides a rich console interface. If you call commands without parameters, it opens intuitive interactive screens.
Interactive Navigation Dashboard
Running the binary with zero arguments opens the main dashboard prompt:
$ melonui What would you like to do? > Initialize MelonUI Project (Set up utils, paths, and core dependencies) Add/Install Components (Search, select, and install components dynamically) Exit
Searchable Component Multiselect List
Running melonui add (or npx @melonui-dev/cli add) without a component name fetches the entire remote component registry list and launches a searchable multi-select selector:
$ melonui add Fetching components from MelonUI registry... Select components to install (Space to select, Enter to confirm, type to search) > [ ] Burst Button [Buttons] - Seeds physically burst from click point [ ] Ripple Button [Buttons] - Radial click ripple effect [ ] Luminous Waves [Backgrounds] - Hardware accelerated WebGL wave field [ ] Retro Grid [Backgrounds] - Nostalgic neon perspective grid
- Use Arrow Keys (Up/Down) to navigate components.
- Press Spacebar to select or deselect components.
- Start typing characters to filter/search dynamically by name, category, or description.
- Press Enter to download and install all selected components.
Command Reference
Initializes the MelonUI workspace configurations. It detects your package manager, installs core requirements (clsx and tailwind-merge), and copies a standard utils.ts file containing the custom Tailwind utility classes joiner.
Pulls the specified component from the registry. If a component name is provided (e.g. melonui add burst-button), it is downloaded directly. If not, it opens the interactive search menu. The CLI automatically downloads the necessary files, resolves dependencies, and installs them using your detected package manager.
Displays usage information, package version, list of commands, and descriptive options.