Theme
The theme configuration allows you to customize the appearance of your app. You can easily change the colors to match your brand.
This project uses CSS variables to define the theme. This makes it easy to customize the appearance of the app.
The marketing and the dashboard apps use the same theme configuration. This means that you can customize the theme in one place and it will be applied to both apps. This gives you a consistent look and feel across your apps.
Customize the theme
Generate a theme
Go to ShadCN Theme Generator and generate a theme to match your brand.
Copy the generated CSS variables.
Update theme
You can find the theme variables in the packages/configs/tailwind-config/styles.css file.
Replace the existing CSS variables in the :root selector with the ones you copied from the theme generator.
Dark Mode
Repeat the process for the dark mode theme.
Instead of replacing the CSS variables in the :root selector, replace the CSS variables in the .dark class selector.
Last updated on