Splash Screen with Logo Image

Splash Screen with Logo Image


Screenshot 2025-12-15 at 11.46.13 PM.png

If you have selected the “Splash with Logo Image ” option for your app. Here are the steps you have to follow:

  • Click to upload your App Icon.

  • Your app icon should be of size 1024x1024 pixels.

1. Icon-Based Startup Screen

Screenshot 2025-12-15 at 11.42.01 PM.png

The custom “Use App icon” is a feature that allows your app icon to appear automatically as the splash screen. You just need to:

  • Click on “Use App icon.” The app icon will appear as the splash screen.

2. Brand Name

  • You have to toggle on this field to enter the name of your brand.

  • You can select the color and position of the text. The position support includes the top, center, and bottom.

brand name.png


3. Splash Background Color

When you turn on the Enable Gradient toggle, additional customizations will appear.

splash bg color .png


  • Color

- You have to select the two colors to create a perfect gradient effect.

  • Gradient

- Select from the given different gradient effects. You can also create your own gradient effect by clicking on the “+” icon.

- By clicking on the “+” icon, two options will appear.


1. Type

  • You have to select the type of gradient effect. It includes Linear, Radial, and Diagonal.

  • You can also adjust the direction of the gradient effect by clicking on the “Degrees” option. It includes 45, 135, 225, and 315.


2. Stops

  • You can control how the two colors will be distributed in the gradient. You can control them using the % of the colors and how much effect they will have on the screen.

4. Advanced Splash Configuration

Select the splash appearance for the screen.

Hide Splash When


1. On Page Load Progress

The splash screen will disappear based on how much of the page is being loaded.

Settings To Hide Splash when On Page Load Progress

- Load Threshold

You have to define how much of your website content will load before the splash screen disappears.

- Minimum Display Time

You can control the minimum number of seconds the splash screen will be visible on the screen.

- Fade Out Animation

You can control the splash screen so it does not disappear suddenly. It should disappear smoothly. You can control this with two options: 200 ms and 500 ms.

on page load progress.png


2. After Fixed Duration

The splash screen will disappear after a fixed duration.

Settings To Hide Splash when After Fixed Duration

- Duration

You have to select the time for the splash screen to be visible on the screen. It includes 1, 2, 3, 4, and 5 seconds.


- Fade Out Animation

You can control the splash screen so it does not disappear suddenly. It should disappear smoothly. You can control this with two options: 200 ms and 500 ms.

fixed duration.png


3. On JavaScript Trigger

The splash screen will only disappear when the JavaScript is triggered.

Settings To Hide Splash when on JavaScript Trigger

- JS Trigger Configuration

You have to configure the JavaScript custom function on your website. So that it runs when your website is ready to display. Visit the Developer Documentation (opens in a new tab) for the integration.

- Fallback Timeout

You have to select the duration of the splash screen to hide if the JS code is not triggered. It includes 5, 8, 10, and 15 seconds of duration.

- Fade Out Animation

You can control the splash screen so it does not disappear suddenly. It should disappear smoothly. You can control this with two options: 200 ms and 500 ms.

on js trigger.png