Customize โ†’ Branding sets how your portal and docs look: colours, logo, fonts and the browser tab's icon. It's also where the "Powered by tuti" badge is turned off. Changes show in the preview as you make them, and Save changes saves them all.

Colour scheme

Colour scheme is the mode readers get if they haven't picked light or dark themselves:

  • System follows each reader's device. This is the default.

  • Light or Dark uses that mode for everyone who hasn't chosen.

A reader's own choice always wins. If you change the default later, readers who never chose get the new one.

The widget uses the same colour scheme, unless the site it's on sets light or dark for it (see Open the widget from your code).

Accent colour

Accent colour is used for buttons and links. Pick it with the swatch or type a hex code, such as #4f46e5. Use the default green goes back to Tuti's colour.

If your colour would be too faint to read in light or dark mode, the portal uses the text colour there instead, so buttons stay readable.

The widget's button has its own colour, set in Customize โ†’ Widget (see Customize the widget).

The Logo card with a logo, a dark-mode logo and a logo link
  • Logo: shown at the top left of your portal and docs, instead of your project's name. Choose Upload or drop an image on the field. PNG, JPEG, WebP or GIF (not SVG).

  • Logo for dark mode: optional, a version that reads on a dark background. Without it, your logo shows in both modes.

  • Logo text: text beside your logo, such as "Help", up to 40 characters. Leave it empty to show the logo alone. Without a logo, the text shows instead of your project's name.

  • Logo link: where the logo goes when it's clicked, such as your website. It needs a full https:// address. Leave it empty for your portal's home.

Remove takes an image off; save to make it stick.

Fonts

Under Typography, Heading font and Body font each pick one of 16 fonts, or Page default for Tuti's own: Inter, Roboto, Open Sans, Lato, Montserrat, Poppins, Source Sans 3, Nunito, Work Sans, DM Sans, Manrope, IBM Plex Sans, Space Grotesk, Merriweather, Lora and Playfair Display.

They're Google Fonts, but Tuti serves them itself, so your readers' browsers never contact Google.

Favicon

Favicon is the icon in the browser tab. A square image works best. Without one, the tab shows Tuti's icon.

Each image can be up to 10 MB. Every image you upload is resized and saved again, which removes its hidden data, such as where a photo was taken. An animated GIF keeps only its first frame.

Hide "Powered by tuti"

Your portal's footer, and the foot of the widget, say Powered by tuti, with a link to tuti.so. On Pro and Business you can hide it with an add-on for $49 a month. See Plans.

  1. Open Settings โ†’ Billing.

  2. Under Hide "Powered by tuti", choose Hide the badge, then Hide the badge again to confirm. The add-on is added to your plan, and you pay for the rest of the current billing period now, with the card on the plan.

The Hide "Powered by tuti" card in Settings โ†’ Billing

The badge disappears from your portal and the widget straight away. In Customize โ†’ Branding, the Powered by tuti card at the bottom now says "Hidden with the add-on on this project's plan."

To bring the badge back, choose Show the badge again in Billing. What's left of the period is credited to your next invoice. The add-on also ends when the plan does, and the badge comes back. For more about billing, see Upgrade, change or cancel a plan.

With the add-on, the Show "Powered by tuti" in the footer box in that card turns the badge on and off, but ticking it doesn't remove the add-on from your bill: use Billing for that. Without the add-on, unticking the box opens Keep "Powered by tuti"? instead: See Billing goes to Billing, and Keep the badge closes it.

The Keep "Powered by tuti"? dialog with See Billing

On the Free plan, Billing says "Paid plans can hide the badge at the foot of the portal for $49 a month." and Choose a plan takes you to the plans.

Self-hosting Tuti? There, hiding the badge takes a licence for the project: the same dialog has Get a licence and Check now.