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

# Branding & Theme

> Configure tenant white-label theme: colors, typography, login assets, and subdomain across four tabs.

The Branding & Theme screen manages tenant white-labeling and theming at the route `/settings/branding`.

## Overview

The screen is a tabbed hub with four sections: Colors, Typography, Login & assets, and Subdomain. Tab state is URL-synced via `useTabUrlState`. The active theme is loaded with `useActiveTheme`; mutations include `useUpsertTheme`, `useResetTheme`, and `useImportTheme`. A reset action triggers an alert dialog for confirmation before clearing org overrides. A preview badge indicates the current theme status. Users with `pf.theme.manage` can modify theme settings; `pf.theme.view` grants read-only access.

## Who it's for

Required permission: `pf.theme.view` (access); `pf.theme.manage` (edit/reset/import — SME: confirm exact manage permission name from code)

## Before you start

* You must hold the `pf.theme.view` permission.

## Steps

<Steps>
  <Step title="Open Branding & Theme">Navigate to Settings → Branding & Theme.</Step>
  <Step title="Browse tabs">Select Colors, Typography, Login & assets, or Subdomain to view/edit that section.</Step>
  <Step title="Modify theme settings">Update color tokens, typography, or login page assets as needed.</Step>
  <Step title="Save changes">Apply changes using the save action within each tab.</Step>
  <Step title="Import a theme">Use the import action to apply a theme from an external source.</Step>
  <Step title="Reset to default">Click Reset and confirm in the alert dialog to restore platform defaults.</Step>
</Steps>

## Key concepts

* `useActiveTheme` — fetches the current tenant theme override
* `useResetTheme` — clears tenant overrides and restores platform defaults
* `useImportTheme` — applies a theme from an imported source

## Related

<Columns cols={2}>
  <Card title="Platform Foundation" icon="layer-group" href="/pf/overview">
    Platform Foundation overview.
  </Card>

  <Card title="Governance & parity" icon="scale-balanced" href="/governance/index">
    Documentation coverage and governance.
  </Card>
</Columns>

<Note>
  This page documents shipped product behavior. It is not medical, legal, or
  billing advice. Verify against your organization's policies and applicable
  regulations before using it for clinical, compliance, or billing decisions.
  Protected health information (PHI) shown in the product is governed by your
  tenant's access controls and is never exposed in this documentation.
</Note>

<Accordion title="Documentation sources">
  * src/routes/platform.tsx
  * src/platform/theming/pages/BrandingSettingsPage.tsx
</Accordion>