Skip to main content

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.

The Branding Preview screen is a developer utility for verifying tenant theme tokens at the route /dev/branding-preview.

​
Overview

The page renders every semantic surface and foreground token pair as side-by-side swatches in both light and dark mode simultaneously. Token groups include surfaces, interactive, form, status, and palette. It uses runTenantVarsAuditAndReport to check WCAG contrast ratios and useActiveTheme to reflect the current tenant theming override. An audit result badge and copy-to-clipboard for token names are available. The page is marked as a developer-only tool — not intended for end-user workflow.

​
Who it’s for

Required permission: pf.wizards.admin

​
Before you start

  • You must hold the pf.wizards.admin permission.
  • This page is intended for developers and design-system reviewers verifying tenant branding changes.

​
Steps

1

Open Branding Preview

Navigate to /dev/branding-preview.
2

Review token swatches

Browse token groups (surfaces, interactive, form, status, palette) in light and dark mode side by side.
3

Check contrast audit results

Review WCAG contrast audit results surfaced by the audit report.
4

Copy token names

Click a swatch to copy the CSS variable name for use in code.

​
Key concepts

  • Semantic color tokens — CSS variables driving all UI colors; no hardcoded hex values
  • WCAG contrast audit — checks foreground/background pairs against accessibility thresholds
  • useActiveTheme — reflects the active tenant white-label override

Platform Foundation

Platform Foundation overview.

Governance & parity

Documentation coverage and governance.
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.
  • src/routes/platform.tsx
  • src/platform/dev/pages/BrandingPreviewPage.tsx