---
title: "invalid-theme-reference"
description: "Reports a --theme() reference to a token that is not defined."
image: "https://stillwind.dev/og.png"
---

> Documentation Index
> Fetch the complete documentation index at: https://stillwind.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# invalid-theme-reference

This rule reports a `--theme()` reference in your stylesheet to a token that the
theme does not define, when the reference has no fallback. The declaration that
contains it produces no CSS.

## Reported

```css
.card {
  color: --theme(--color-brand);
}
```

> invalid-theme-reference: `--theme(--color-brand)` names no theme token and has no fallback
> 
> Example:2:10

## Fixed

```css
@theme {
  --color-brand: oklch(0.6 0.2 250);
}

.card {
  color: --theme(--color-brand);
}
```

## How to fix

- Define the token in `@theme`, as in the example, or correct the spelling of its
  name.
- If the token is optional, add a fallback: `--theme(--color-brand, blue)`.

Malformed `--theme()` syntax causes [SW14007](/docs/errors/SW14007) instead.

## Rule settings

| Preset | Severity |
| --- | --- |
| `recommended` | deny |
| `strict` | deny |
| `stylistic` | off |

[Configure lint](/docs/configuration#lint) to change the severity or options.

Source: https://stillwind.dev/docs/lints/invalid-theme-reference/index.mdx