# theme.mode

Part of [Theme](https://kernstra.com/docs/web-sdk/config/theme) in the Kernstra Web SDK 1.0.0 configuration reference.

- Type: `'light' | 'dark' | 'auto'`
- Default: `'light'`
- Page: https://kernstra.com/docs/web-sdk/config/theme/mode

Theme mode. `'auto'` follows the OS through `prefers-color-scheme`; `'light'` and `'dark'` beat the OS in both directions. Applied as a `data-ks-theme` attribute on the viewer's root element (`.ks-viewer`, inside your container), so two viewers on one page can differ. The **document itself never darkens** — see [Theme tokens](https://kernstra.com/docs/web-sdk/guides/theme-tokens) for what the theme does not touch.

- `'light'`: Default. Light chrome regardless of the OS.
- `'dark'`: Dark chrome regardless of the OS. The document itself never darkens.
- `'auto'`: Follow `prefers-color-scheme`.

```ts
theme: { mode: 'auto' }
```

Web page: https://kernstra.com/docs/web-sdk/config/theme/mode