Installation
Install and start using Launch UI
Choose your preferred way of getting started:
Create new project
The easiest way is to use the template available on GitHub:
Launch UI Template
With this template, you get a fully-fledged Next.js landing page, with Shadcn/ui and Tailwind CSS already set up and a few sections already implemented.
Follow the README to get started. Then, use this documentation to add more components.
Prefer a blank project?
If you prefer to start from scratch, run:
npx shadcn@latest init 'https://launchuicomponents.com/r' -d
This command will create a blank Next.js project with all the required configuration files. However, it will not install any components or examples.
Use a different framework
If you prefer to use a different framework than Next.js, such as Remix, Astro or Vite, start by following the shadcn/ui documentation.
Then, follow the instructions below on how to add Launch UI to an existing project.
Shadcn/ui configuration
The -d
flag makes Shadcn/ui use the default config (new-york
as style, zinc
as grey color and yes
for the css variables).
Using these options will make sure that Launch UI components display correctly.
Add to existing project
Run the following command inside your project's directory:
npx shadcn@latest init 'https://launchuicomponents.com/r' -d
This command will create or update your Tailwind and Shadcn/ui configs as well as import all the CSS that Launch UI needs to work.
You can now start adding components to your project.
Watch out for overrides
If you already have tailwind.config.ts
and globals.css
files in your project, this command will try to override them.
If you don't want to lose your existing configuration, you'll have to merge in Launch UI's tailwind extensions and css variables manually.
Add to an existing project that already uses shadcn/ui
If the project already uses shadcn/ui, you can add Launch UI to it by running:
npx shadcn@latest add 'https://launchuicomponents.com/r'
You can now start adding components to your project, same as you would do with your existing shadcn/ui components.
Troubleshooting
If the CLI command doesn't work, try running npx shadcn@latest init -d
to see if the issue persists.
If it does, refer to the shadcn/ui documentation first. In such case, it's a shadcn/ui issue, not a Launch UI one.
Things might not work as expected especially if you're using Next.js 15 (or React 19 in general).
If the npx shadcn@latest init -d
command succeeds, run npx shadcn@latest add "https://launchuicomponents.com/r"
.
If this fails, please get in touch with me or open an issue on GitHub so I can help you out.
Need help?
File a feature request, report a bug, or ask me anything.