Theming with CSS Variables
Follow these steps to set up the PaceUI theme in your existing project or create a new one using shadcn's CLI
It will add useful dependencies, extra variables, and a default theme to your CSS file.
You can choose from various base colors: gray, slate, zinc, or neutral (Neutral is the default color applied by the CLI).
You can choose from various primary (pre-defined by PaceUI) colors: blue, purple, green, teal, orange or rose (Blue is the default color applied by the CLI).
Here are the steps to set up the PaceUI theme in your existing project:
@theme layer, if you haven't addedHere's app.css file looks like:
Loading...
Add the following to your app.css file to set neutral as the base color and blue as the brand color.
Loading...
Update the following variables to your app.css file:
Update the following variables to your styles/globals.css file: