App branding

Change the way your app looks to align with your branding and color scheme.

Your logo is always visible in the member app and the backend. Make sure the logo looks great in both. Typically a png image works best. Sometimes image scaling of large images results in suboptimal quality. Try uploading an image with a lower resolution to see if that resolves the issue.

Upload your logo:

  • Go to “General settings” on the “Settings” page
  • Click on the “Pencil” icon next to the logo
  • Select the logo image file with the explorer window
  • Click “Open”

The following image formats are supported: JPEG, PNG, GIF, Animated GIF, WebP, Animated WebP, BMP, and WBMP. Typically PNG is well suited for a high quality logo with a small storage size. Minimizing storage size reduces the loading time of the image, so avoid using an unnecessarily large/ detailed logo.

Colors

Set the highlight and lowlight colors to match with your branding/ business’ color scheme.

  • The lowlight color determines the top/ side bar in the app, typically a dark color works best. Your logo will be shown on top of the top/ side bar, so it is important to ensure there is enough contrast between the logo and the lowlight color.
  • The highlight color is used in the member and backend app to highlight certain elements (e.g. selected date or location). Depending on the brightness setting (see below), the highlight color will be displayed on a white or dark grey background. Make sure you test if the selected highlight color works for both.

To change a color:

  • Go to “General settings” on the “Settings” page
  • Click on the “Pencil” icon next to the color you want to change
  • In the color selection dialog you have the option to:
    • Enter the hex code of the color directly, or
    • Select a base color with the outer ring and fine tuning it with the middle square
  • Click “Save” (or “Cancel” to disregard the changes)

Do you have a specific color, but you don’t have the hex code?

  • If you know the color in a different color notation (such as rgb), convert it to hex with a color converter →
  • If you only have an image, use an application that contains a ‘color picker’, such as Microsoft PowerPoint to obtain the color code

In addition to these colors, the look and feel of your app is heavily dependent on the colors you use for the session types. By aligning these colors with the highlight and lowlight colors in a good looking ‘color scheme’ your app will look much better. Need inspiration for colors that complement each other nicely? A great way to get suggestions is to use My Color Space →

Brightness

Set the default brightness that you want your app:

  • Light: The app will be shown in ’light mode’ by default, a white background with black text
  • Dark: The app will be shown in ‘dark mode’ by default, a dark grey background with white text
  • Based on system: The app will check the device settings and align the brightness setting (dark or light) with the users’ device.

Change the brightness setting:

  • Go to “General settings” on the “Settings” page
  • Click on the “Pencil” icon next to the “Dark/ light mode” setting
  • Select the desired setting by clicking on the icon
  • Click on the “Save” icon
← Payment collection
Member/ employee import →