Customize your site branding and appearance

Customize your site's appearance to match your brand identity. As an admin, you can control how your site looks to members by configuring logos, site name, colors, fonts, and navigation elements.

What you can customize

As an admin, you can add and edit the following branding elements:

  • Logo: The symbol or design used to identify your site.

  • Site Name: The name members use to identify your site.

  • Theme: Your site's color theme, which automatically applies across the entire site. This determines the site's Primary, Background, Secondary, and Text colors.

  • Font/Typography: Select from available fonts that will be reflected across your site.

  • Top Navigation: The top horizontal menu that displays top-level items of your website's structure.

For a video overview of these features, see the branding and appearance academy video.

Customize your site logo

Logo customization interface

To upload your logo:

  1. Log in with your admin account

  2. Click your profile picture in the top-right corner

  3. Select Administration > Appearance > Logos

  4. Upload your logo image, square image, and favicon

You can upload separate light and dark versions of your logos.

Logo types and where they appear

  • Logo image: Appears on your site's top navigation and at the top of email notifications. If you don't provide a logo, your site name will display instead.

  • Square logo: A squared version appears at the top of the administration area and serves as your mobile home screen app icon.

  • Favicon: Appears as the icon in the browser tab and browser favorites/bookmarks.

Change your site name

Site name settings

Your site name appears throughout your site and helps members identify it.

To change your site name:

  1. Log in with your admin account

  2. Click your profile picture

  3. Select Administration > Settings

  4. Go to the Site Settings tab

  5. Add or edit the site name

  6. Click Update to save your changes

Customize your color theme

Color theme customization

To customize your color theme:

  1. Log in with your admin account

  2. Click your profile picture in the top-right corner

  3. Select Administration > Appearance > Themes

  4. Browse available themes and select one as a base template

  5. Decide whether to offer dual themes (light mode and dark mode)

  6. Select light or dark mode and customize by clicking the pencil icon next to the theme name

  7. Click each color element and select a color, or enter your brand's hexadecimal or RGB color code for an exact match

  8. Review your changes in the preview panel in the middle of the screen

  9. Click Save Changes at the top right to save

Customize element styles

Element styles customization

To customize your element styles:

  1. Log in with your admin account

  2. Click your profile picture in the top-right corner

  3. Select Administration > Appearance > Styles

  4. Configure the style for each element:

    • Corners: Choose the shape of cards, inputs, alerts, modals, and similar components

    • Cards

    • Buttons

    • Avatar placeholder

    • Avatar corner

    • Icon style

  5. Click Save Changes at the top right to save

Select your typography (font)

Typography/font selection

To change your site font:

  1. Log in with your admin account

  2. Click your profile picture in the top-right corner

  3. Select Administration > Appearance > Typographies

  4. Click one of the available font options

  5. Preview the font in the center of the screen

  6. Click Save Changes at the top right to save

White-label your site (remove the "Powered by Bettermode" badge)

By default, all sites display a "Powered by Bettermode" badge in the bottom left sidebar and in email notification footers.

To remove the badge:

  1. Log in with your admin account

  2. Access Administration > Settings

  3. Stay on the Site Settings tab

  4. Scroll down to the White Label section

  5. Turn off the toggle

  6. Click Update to save

Related topics

Contact Us

Do you still need help? Learn how to get in touch with the Bettermode Team.