{/* Generated by packages/docs/script/generate-theme-tokens.ts. Do not edit. */}

```json title="my-theme.json"
{
  "version": 2,
  "light": {
    "hue": {
      "accent": "$hue.purple",
      "interactive": "$hue.purple"
    },
    "text": {
      "default": "$hue.neutral.900"
    },
    "background": {
      "default": "#fafafa"
    }
  },
  "dark": {
    "mergeMode": true,
    "text": {
      "default": "$hue.neutral.100"
    },
    "background": {
      "default": "#101014"
    }
  }
}
```

## Token reference

This reference is generated from the Effect schema in
`packages/tui/src/theme/v2/schema.ts`. Changes to the runtime schema update
this section through `bun run generate`.

### Hue tokens

Every hue is a 9-step scale. Define a scale with all of these
steps, or alias it to another hue with a value such as `$hue.blue`.

|       | Values                                                                                                   |
| ----- | -------------------------------------------------------------------------------------------------------- |
| Hues  | `gray`, `red`, `orange`, `yellow`, `green`, `cyan`, `blue`, `purple`, `accent`, `interactive`, `neutral` |
| Steps | `100`, `200`, `300`, `400`, `500`, `600`, `700`, `800`, `900`                                            |

Reference a hue color as `$hue.<name>.<step>`, for example
`$hue.interactive.500`.

### Semantic tokens

Semantic values can reference another token by prefixing its path with `$`,
for example `$text.default`. Stateful tokens inherit their `default`
value when a state is omitted.

| Group                  | Tokens                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                       |
| ---------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `text`                 | `text.default`<br />`text.subdued`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           |
| `text.action`          | `text.action.primary.default`<br />`text.action.primary.$hovered`<br />`text.action.primary.$focused`<br />`text.action.primary.$pressed`<br />`text.action.primary.$selected`<br />`text.action.primary.$disabled`<br />`text.action.destructive.default`<br />`text.action.destructive.$hovered`<br />`text.action.destructive.$focused`<br />`text.action.destructive.$pressed`<br />`text.action.destructive.$selected`<br />`text.action.destructive.$disabled`                                                                         |
| `text.formfield`       | `text.formfield.default`<br />`text.formfield.$hovered`<br />`text.formfield.$focused`<br />`text.formfield.$pressed`<br />`text.formfield.$selected`<br />`text.formfield.$disabled`                                                                                                                                                                                                                                                                                                                                                        |
| `text.feedback`        | `text.feedback.error.default`<br />`text.feedback.error.subdued`<br />`text.feedback.warning.default`<br />`text.feedback.warning.subdued`<br />`text.feedback.success.default`<br />`text.feedback.success.subdued`<br />`text.feedback.info.default`<br />`text.feedback.info.subdued`                                                                                                                                                                                                                                                     |
| `background`           | `background.default`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |
| `background.surface`   | `background.surface.offset`<br />`background.surface.overlay`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |
| `background.action`    | `background.action.primary.default`<br />`background.action.primary.$hovered`<br />`background.action.primary.$focused`<br />`background.action.primary.$pressed`<br />`background.action.primary.$selected`<br />`background.action.primary.$disabled`<br />`background.action.destructive.default`<br />`background.action.destructive.$hovered`<br />`background.action.destructive.$focused`<br />`background.action.destructive.$pressed`<br />`background.action.destructive.$selected`<br />`background.action.destructive.$disabled` |
| `background.formfield` | `background.formfield.default`<br />`background.formfield.$hovered`<br />`background.formfield.$focused`<br />`background.formfield.$pressed`<br />`background.formfield.$selected`<br />`background.formfield.$disabled`                                                                                                                                                                                                                                                                                                                    |
| `background.feedback`  | `background.feedback.error.default`<br />`background.feedback.warning.default`<br />`background.feedback.success.default`<br />`background.feedback.info.default`                                                                                                                                                                                                                                                                                                                                                                            |
| `border`               | `border.default`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             |
| `scrollbar`            | `scrollbar.default`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
| `diff.text`            | `diff.text.added`<br />`diff.text.removed`<br />`diff.text.context`<br />`diff.text.hunkHeader`                                                                                                                                                                                                                                                                                                                                                                                                                                              |
| `diff.background`      | `diff.background.added`<br />`diff.background.removed`<br />`diff.background.context`                                                                                                                                                                                                                                                                                                                                                                                                                                                        |
| `diff.highlight`       | `diff.highlight.added`<br />`diff.highlight.removed`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |
| `diff.lineNumber`      | `diff.lineNumber.text`<br />`diff.lineNumber.background.added`<br />`diff.lineNumber.background.removed`                                                                                                                                                                                                                                                                                                                                                                                                                                     |
| `syntax`               | `syntax.comment`<br />`syntax.keyword`<br />`syntax.function`<br />`syntax.variable`<br />`syntax.string`<br />`syntax.number`<br />`syntax.type`<br />`syntax.operator`<br />`syntax.punctuation`                                                                                                                                                                                                                                                                                                                                           |
| `markdown`             | `markdown.text`<br />`markdown.heading`<br />`markdown.link`<br />`markdown.linkText`<br />`markdown.code`<br />`markdown.blockQuote`<br />`markdown.emphasis`<br />`markdown.strong`<br />`markdown.horizontalRule`<br />`markdown.listItem`<br />`markdown.listEnumeration`<br />`markdown.image`<br />`markdown.imageText`<br />`markdown.codeBlock`                                                                                                                                                                                      |

### Contexts

`@context:elevated` and `@context:overlay` accept partial
overrides of the semantic tokens above. Components apply these contexts to
surfaces that need different contrast without changing the base theme.