# Updating the Tailwind CSS Shadcn Theme

> How to update the Tailwind CSS theme in your application

*Canonical: https://makerkit.dev/docs/tanstack-drizzle/branding/tailwind-css*

---

This kit uses [Tailwind CSS](https://tailwindcss.com) to style the application.

### Tailwind CSS (v4) Configuration

You can update the configuration in the `apps/web/src/styles.css` file.

This file imports the following Tailwind CSS configuration files:
- `apps/web/src/styles.css`: - the main global styles entry for the application (imports the other files)
- `apps/web/src/styles/theme.css` - this is where we store the Shadcn UI theme for Tailwind CSS v4
- `apps/web/src/styles/shadcn-ui.css` - here we create the variables for the Shadcn UI theme
- `apps/web/src/styles/markdoc.css` - for markdoc content
- `apps/web/src/styles/makerkit.css` - for makerkit-specific styles
- `apps/web/src/styles/custom.css` - for custom styles where you can override the default style, either define your own colors or pick a theme from the [Shadcn UI Themes page](https://ui.shadcn.com/themes).

## Shadcn UI

The kit uses [Shadcn UI](https://ui.shadcn.com) and it defines the theme according to its guidelines.

You can find the default theme inside the application at `apps/web/src/styles/shadcn-ui.css`.