The SDK supports white-label theming through the `theme` option on `Checktiv.init()`. Theming is set in your frontend code at initialization time and threads into the capture journey automatically.

There is no console-persisted theme in the current version. Set theming in your `init()` call; it applies to every module mounted from that client instance.

Brand your own page and layout around the SDK embed for logos and full custom styling. The `theme` object controls the color inside the capture journey itself.

## Available theme options

```ts
Checktiv.init({
  publishableKey: 'ah_pk_us_test_...',
  getSessionToken: async (ctx) => {
    /* ... */
  },
  theme: {
    primaryColor: '#0b5fff', // hex color; defaults to the platform blue
  },
});
```

| Option         | Type     | Description                                                                                                                     |
| -------------- | -------- | ------------------------------------------------------------------------------------------------------------------------------- |
| `primaryColor` | `string` | Hex color string (e.g. `#0b5fff`). Applied to primary buttons, progress indicators, and focus rings inside the capture journey. |

## How theming is applied

When the SDK mounts a module, it passes `theme` to the capture journey via the `capture:init` message. The journey applies the values as CSS custom properties inside its sandboxed iframe. Your page's CSS does not affect the capture UI (it runs in a shadow root), so all styling must go through the `theme` object.

## Example: matching your app's brand

```js
import { init } from '@checktiv/sdk-web';
import '@checktiv/sdk-web/idv'; // registers the IDV module that mountProvisioned renders

const client = init({
  publishableKey: 'ah_pk_us_test_...',
  getSessionToken: async (ctx) => {
    const res = await fetch('/api/checktiv/token', { method: 'POST' });
    return (await res.json()).token;
  },
  theme: {
    primaryColor: '#6200ee',
  },
});

client.mountProvisioned({ target: document.getElementById('idv-container') });
```

## Related pages

- [Quickstart](/developers/sdks/quickstart) - end-to-end integration including theming
- [React](/developers/sdks/react) - pass `theme` through `<ChecktivProvider>`