Components

next-forge contains a design system out of the box powered by shadcn/ui.

​

Default configuration

shadcn/ui has been configured by default to use the “New York” style, Tailwind’s neutral color palette and CSS variables. You can customize the component configuration in @repo/design-system, specifically the components.json file. All components have been installed and are regularly updated.

​

Installing components

To install a new component, use the shadcn CLI from the root:

npx shadcn@latest add select -c packages/design-system

This will install the component into the Design System package.

​

Updating components

To update shadcn/ui, you can run the following command from the root:

npx shadcn@latest add --all --overwrite -c packages/design-system

We also have a dedicated command for this. Read more about updates.

​

Changing libraries

If you prefer a different component library, you can replace it at any time with something similar, such as Tailwind’s Catalyst.