Notification

The AppSheet Help Center documentation can now be viewed in Japanese - AppSheet ヘルプセンターのドキュメントが日本語で表示できるようになりました。. Learn more

Style: The Essentials

Configure the theme and brand to control the appearance of your app. Your choices in this part of the editor allow you to choose a color theme, select images that are relevant to you and your users, and have an icon that represents your business. You can select these images from your cloud provider. In addition, you can change theme colors, fonts, and text size. You can also customize your About page to better describe the app to your users. 

 To configure the theme and brand: 

  1.  Open the app in the app editor.
  2. Go to Settings Settings icon > Theme & Brand.
  3. Configure the settings.
  4. When you are done, save the app by selecting one of the following:
    • Save - Save the app.
    • Save & verify data - Save the app and verify that it is runnable based on external dependencies.
We've made some improvements to the app editor.
You are opted in to the new editor by default, but you can switch back to the legacy editor at any time.
 

If you are using the legacy editor

 To configure the theme and brand: 

  1. Open the app in the app editor.
  2. Select UX > Brand.
  3. Configure the settings.
  4. When you are done, save the app by selecting one of the following:
    • Save - Save the app.
    • Save & verify data - Save the app and verify that it is runnable based on external dependencies.

There are several branding elements that you can customize in the editor.

UX > Brand page configuration

Configure the theme and brand using the settings described in the following table.

Setting Description
Theme Choose a light or dark theme.
Primary color Select the color palette used in the app to control the appearance of the header, footer, text, and icons. You can select one of the colors in the palette or click Custom to select a custom color.
App logo

Specify the icon that your users click to launch your app from the device's home screen and to display in the App Gallery. See also Access your apps.

We encourage you to provide an icon that reflects your business or brand. This icon should be a square image up to 196 X 196 pixels in size. AppSheet automatically resizes it for different environments. It is recommended that the logo not exceed 500 KB.

Launch image

Specify the image shown when the application is initially launched, and when Sync is in progress. It should be at least 600 x 600 pixels in size, and ideally large enough to completely cover its container.

Note: AppSheet scales the image to the smallest possible size to completely cover the container. The ratio is maintained, but the image may be cropped vertically or horizontally.

Background image Specify the image to be used for the background for all pages in the app. It should be at least 1000 x 1000 pixels in size. Try different background images to find one that works aesthetically. If your application data contains images, a background image can be distracting. You can select images from your cloud provider. It's a good idea to keep your images in the same folder as your app's spreadsheet.
Header & Footer Customize the header and footer in your app to show or hide the view name, logo, or menu and search buttons, and style the header and footer.
Fonts

Configure the font style and size for the app content.

The font style applies throughout the app and may not be overridden elsewhere. The font size also applies throughout the app, but format rules may be used to adjust font size in some places.

Custom fonts are not supported.

Examples of font settings

 

Was this helpful?

How can we improve it?

Need more help?

Try these next steps:

Search
Clear search
Close search
Main menu
7863177017573618689
true
Search Help Center
true
true
true
false
false