Skip to main content
Branding sets your colors and logos once. They flow into the sidebar, buttons, links, focus rings, the client portal, the favicon, and any PDF reports MSPortal generates. Open it from the wizard, or from Settings → Tenant → Branding.

​
What you can set

The page has five tabs.

​
Colors

A single Primary brand color picker (hex input or color wheel). MSPortal generates the full 12-step color scale from this one value, including the dark-mode variant. The color drives:
  • Primary and secondary buttons
  • Links
  • Active sidebar item
  • Focus rings and accent badges
The live preview to the right shows the desktop view (light and dark side by side) and a mobile view, so you can see a button, a badge, an active sidebar item, and a link before saving. Click Save color when you’re happy with it. The button stays disabled until the value is dirty and valid.

​
Light mode

Two uploads, each with an in-browser crop dialog:
  • Primary logo – horizontal logo for the expanded sidebar. Recommended 140×32.
  • Small icon – square mark for the collapsed sidebar. Recommended 32×32.

​
Dark mode

Same two uploads as Light mode, but the dark variants. If you don’t upload a dark version, MSPortal falls back to the light one.

​
Favicon

The icon that appears in the browser tab. Recommended 32×32. PNG or ICO only. No crop dialog.

​
Reports & Certs

The logo MSPortal embeds on generated PDF reports and compliance certificates. Flexible dimensions; no crop dialog.

​
File limits

AssetFormatsMax size
Primary logo, small icon, reporting logoPNG, JPG, SVG1.5 MB
FaviconPNG, ICO256 KB
If you exceed the limit the upload is rejected with an error.

​
Save behavior

  • Color: manual save via the Save color button.
  • Logos and favicon: each upload auto-saves the moment the crop dialog closes (or, for the favicon and reporting logo, the moment the file is selected). You don’t need a separate save click.

​
When the wizard step marks complete

The wizard ticks this step off as soon as you have a primary logo uploaded. Setting only the color is not enough; the auto-detection looks for a logo before it considers the step done.

​
Tips

  • Use SVG for the primary logo if you have one; it scales cleanly into the sidebar at any density.
  • The crop dialog is mandatory for the primary and small logos. You’ll always end up with the recommended aspect ratio, so pick a source image with some breathing room around the wordmark to avoid clipping it.
  • Test the dark variant. If your logo has a dark background or thin black strokes, it will disappear against the dark sidebar; upload a contrasting version under the Dark mode tab.
  • The brand color is per-tenant and applies to every user in your tenant. There’s no per-user override.