Branding

Branding is data, not markup. src/config/branding.ts defines the shipped defaults; Settings → Branding lets an end user override them at runtime.

export const defaultBranding: BrandingConfig = {
  companyName: "Northstar Holdings",
  logoUrl: "/logos/northstar.svg",
  faviconUrl: "/favicon.ico",
  primaryColor: "#2455c4",
  secondaryColor: "#0f766e",
  currency: "USD",
  currencySymbol: "$",
  dateFormat: "MMM d, yyyy",
  timezone: "UTC",
  fiscalYearStartMonth: 1,
  locale: "en-US",
  defaultDashboard: "/dashboard",
};

How colours propagate

BrandingProvider writes the palette onto document.documentElement as CSS variables:

Because every component and chart references the variables rather than literal colours, changing one value restyles the whole application — including Recharts series, which read var(--chart-N).

Semantic colours (--positive, --negative, --warning) stay fixed so that "profit is green, loss is red" survives rebranding. Override them in src/app/globals.css if your palette demands it.

Logo

Drop your file in public/logos/ and set logoUrl. A square SVG around 40×40 works best; the sidebar renders it at 28px and the sign-in screen at 40px. The image hides itself if the URL 404s, so a broken path degrades quietly.

Dark mode

globals.css defines a second token set under .dark. Both palettes are adjusted for contrast — if you change primaryColor to something very dark, check it against the dark theme, since the runtime override applies to both.

Formats

Currency, locale and date format run through src/lib/format. Setting them via branding calls setFormatDefaults, so every formatCurrency, formatNumber, formatPercent and formatDate call in the app follows without prop drilling.

Percentages are stored as whole numbers (14.8 means 14.8%) throughout the codebase — keep that convention if you add calculations.

Changing the product name

NEXT_PUBLIC_APP_NAME covers titles and help text. For a deeper rename (package name, repository, docs), see white-label.md.