---
title: Theming & Customization
description: Managing styles, themes, and dependencies in Delta Components
---

## Theme Inheritance

Delta Components are designed to be "theme-agnostic." They do not ship with their own colors or fonts. Instead, they inherit the CSS variables defined in your project's `globals.css` (e.g., `--primary`, `--muted-foreground`, `--radius`).

If your project is already set up with [shadcn/ui](https://ui.shadcn.com/), Delta Components will automatically match your existing brand immediately upon installation.

## Customizing Themes

You can preview how Delta Components look across different artistic directions using the [Themes](/themes) page.

To apply a specific theme to your project:

1.  Browse the style tiles on the **[Themes](/themes)** page.
2.  Click the **`{ } Code`** button on your desired theme card.
3.  Install the theme using one of the following methods:

### CLI (Recommended)

Use the shadcn CLI to automatically install the theme into your project:

```bash
npx shadcn@latest add https://deltacomponents.dev/r/themes/[theme-name].json
```

Replace `[theme-name]` with the theme identifier (e.g., `galway`, `dublin`, `limerick`).

### Manual Installation

Copy the CSS variables provided and paste them into your `globals.css` file, replacing the existing values in your `:root` and `.dark` blocks.

## Styling Components

Since you own the code, customization is done directly via Tailwind utility classes.

```tsx
// Example: Changing the background color of an Admonition
<Admonition
  className="border-blue-200 bg-blue-50" // Overrides default generic styles
  type="info"
>
  ...
</Admonition>
```