# Managing Themes
How to add, remove, and read themes in a .lottie package with dotlottie-io.

# Managing Themes

Themes let a single `.lottie` package carry multiple visual variations (color palettes, property overrides) that a player can apply at runtime.

## Adding a theme

```javascript
dotlottie.addTheme("dark", "Dark Theme", JSON.stringify({ rules: [] }));
```

- `id` — a unique identifier for this theme within the package
- `name` — an optional human-readable display name; pass `null` to omit it
- `jsonData` — the theme data as a `Buffer` or JSON string, with a `{ rules: [...] }` shape

## Associating a theme with an animation

Set a theme as an animation's default via `initialTheme`, or list several as available via `themes`, when calling [`addAnimation`](/docs/tools/dotlottie-io/core-concepts/animations):

```javascript
dotlottie.addAnimation("hero", heroBuffer, {
  initialTheme: "dark",
  themes: ["dark", "light"],
});
```

## Removing and reading themes

```javascript
dotlottie.removeTheme("dark"); // throws if not found
dotlottie.getThemeJson("dark"); // → string | null
dotlottie.themeIds(); // → string[]
```

## Finding which animations use a theme

```javascript
dotlottie.animationsUsingTheme("dark"); // → string[]
```

See [Querying Relationships](/docs/tools/dotlottie-io/guides/querying-relationships) for more cross-reference queries like this one.

Next up: [Managing State Machines](/docs/tools/dotlottie-io/core-concepts/state-machines)