Add your logo and brand colors to a tour
Set the player's colors in Global Aesthetics and put your logo in the Side Nav - List Menu sidebar or the Top Nav Bar - Multi Menu: what each changes and needs.
Guide6 min read Updated
On this page
The short answer
Colors are on the tour's Design tab, in Global Aesthetics: Primary UI Color, Interface Text Color, Interface Icon Color and Radar & Hotspot Elements. A logo goes in the Side Nav - List Menu sidebar (Enable Sidebar Brand Logo) or in the Top Nav Bar - Multi Menu (Logo). The player has no logo in its top bar, and the tour editor has no Branding tab. Click Save & Render to save. A hosted tour has a third logo: on the Publish tab, in Hosting, Add your logo and words puts your own logo, words and colors on the round patch over the tripod (see Add your own branding to a hosted tour). It is not set on the Design tab.
Who can do it
- The owner, and a collaborator whose role includes the Design tab (Admins, by default). Save & Render also needs the Settings tab in the role.
- Editing needs no particular plan. For what visitors get on a Free plan, see What visitors get.
Set the colors
- Open the Design tab and click Global Aesthetics under Component Modules.
- Pick a color with the color box, or type a hex code such as
#1b4d3ein the box beside it. A color the player cannot read is replaced by the default. - Watch the preview beside the panels. It follows your changes a moment later, before you save.
- Click Save & Render.
| Setting | What it colors | Starts as | Shown in |
|---|---|---|---|
| Primary UI Color | The background of the bars and panels | #141419 |
Basic |
| Glass Transparency | How solid that background is, from 0 to 100 percent | 60 | Advanced |
| Backdrop Blur | The blur behind it, from 0 to 40 px | 12 | Advanced |
| Interface Text Color | Text on the bars and panels | #ffffff |
Basic |
| Interface Icon Color | Icons on them | #ffffff |
Advanced |
| Radar & Hotspot Elements | Hotspots and the floor-plan radar | Hotspots take the Primary UI Color, and the radar keeps its own indigo, until you pick a color. Use theme undoes it | Basic |
| Global Typography Font | The font. The list is fixed: you cannot upload a font | Default System Font | Basic |
| Base Font Size | Text size, from 12 to 24 px | 16 | Advanced |
Under every color picker of the tour's editor is a row labeled Theme colours: the colors your tour's design already uses, the main three first, then the colors of the bars, menus and hotspots that have their own. Click one to use it there, so you can keep the tour consistent without typing a hex code. The row changes as your design does, and a color you picked from it stays as it is if you change the original later.
To color one bar apart from the rest, tick Enable Custom Styling at the end of its panel (see Customize the player's bars). The Top Nav Bar - Multi Menu follows these colors unless you choose Light, Dark or Custom colours for its Look.
Add a logo to the sidebar
- Open Side Nav - List Menu and tick Enable Side Nav - List Menu. The logo is part of this sidebar. On a phone the sidebar can also be opened from the Sidebar Menu Button in Mobile Navigation.
- Enable Sidebar Brand Logo is on by default. Click Upload or Choose from Assets below it.
- In the Select Brand Logo window, drop or choose an image, or click one you already have. A new upload is chosen at once.
- The logo appears under Selected Logo, with Change Logo and Remove. On Advanced, Logo Position puts it at the Top of Sidebar (the default) or the Bottom of Sidebar.
- Click Save & Render.
Add a logo to the menu bar
Open Top Nav Bar - Multi Menu and, under Logo, click Upload or Choose from Assets. On Advanced, Logo Position puts it at the right end of the bar (the default) or the left end. The bar shows only when its menu has at least one item: see Build a Top Nav Bar - Multi Menu.
About the picker
- It takes PNG, JPG, WebP, SVG or GIF, up to 10 MB. The window suggests a transparent PNG or SVG.
- A picture is stored as a WebP at most 2,000 pixels on a side, and an SVG stays an SVG. The upload becomes one of the tour's files and is part of your library: see The Asset Library.
- Removing a logo from a panel takes it off the tour and keeps the file.
What visitors get
- On a Free plan a tour in a free theme, the Default Theme, shows visitors your logos and colors on its public page and in embeds. A tour in a Pro theme that has never been hosted shows the free Default look instead: the colors are the Standard colors, and your logos stay, because a theme does not carry logos. A free download is the Standard design, with the Standard colors and no logo of yours. A paid plan (Pro, Agency or Enterprise), or a Vault that hosts the tour or has hosted it, shows your own colors in any theme. The Design tab, its preview and the Preview tab always show them.
- Save & Render refreshes the stored copy that visitors get, unless the tour uses Draft Workflows: then nothing reaches them until you click Publish Changes. To check, open the player address inside the Web Embed Code on the Publish tab in a new tab, or the tour's Explore page and click the play button on its picture. My changes do not show for visitors has the rest.
- A logo or a color you set on the Design tab does not replace Panoramr's own start screen or the round badge on the floor: hosting does (see Remove Panoramr branding).
Troubleshooting
My color looks lighter than the one I chose. The bars use the color at the Glass Transparency you set, 60 by default. Raise it to 100 for the exact color.
The logo does not show in the player. Check that Enable Side Nav - List Menu and Enable Sidebar Brand Logo are ticked and a logo is chosen. Then check the plan, the stored copy and Draft Workflows (above).
The picker refuses my file. It says That file is not an image. Choose a PNG, JPG, WebP, SVG or GIF. or That image is over 10 MB. Choose a smaller one. The server can say The file is over the N MB your plan takes for one file. or Library Storage Full: Your plan includes …: free space in The Asset Library. Until your email address is confirmed it says You can't upload images right now. If you haven't verified your email address yet, do that first.
I cannot find the Branding tab. It is not shown to anyone. Colors and logos are on the Design tab.
I cannot find an option. The Design tab is in Basic. Click Advanced.
Next steps
Was this article helpful?