Splashscreen

Custom splashscreen configuration for universal apps. Control the duration, background color, and custom icon to provide a branded app launch experience across both Android and iOS platforms.

⚙️ Configuration

Duration (ms)

1000ms

Background Color

Custom Icon

Catalyst logo (fallback)

📱 Preview

💻 Generated Configuration

{
  "splashScreen": {
    "duration": 1000,
    "backgroundColor": "#ffffff"
  }
}

Configuration

Configure the splashscreen through the splashScreen object in your app configuration.

Basic Configuration

{
  "splashScreen": {
    "duration": 2000,
    "backgroundColor": "#ffffff"
  }
}

Full Configuration

{
  "splashScreen": {
    "duration": 2000,
    "backgroundColor": "#ffffff",
    "imageWidth": 120,
    "imageHeight": 120,
    "cornerRadius": 20
  }
}

Custom Images

Place your custom splashscreen image in the platform-specific directories:

Android: public/android/splashscreen.{png|jpg|webp}

• Supported formats: PNG, JPG, WebP
• Fallback: App launcher icon

iOS: public/ios/splashscreen.{png|jpg|jpeg}

• Recommended: PNG format (512x512px)
• File size: Keep under 1MB
• Fallback: Progress bar with loader

Platform-Specific Behavior

iOS-Only Features

• Auto-Dismiss: Omit duration to automatically dismiss when WebView loads
• Fade Animation: Smooth fade-out animation on dismissal

Android-Only Features

• Theme Support: Automatically adapts to light and dark mode

Configuration Options

Property	Type	Default	Description
duration	number	1000	Duration in milliseconds. Omit for auto-dismiss on iOS
backgroundColor	string	"#ffffff"	Background color in hex format (e.g., #ffffff, #FF5733)
imageWidth	number	120	Width of splash image in dp/px
imageHeight	number	120	Height of splash image in dp/px
cornerRadius	number	20	Corner radius in dp/px. Set to 0 for square, or half of width/height for circular

Usage Examples

Basic Example

{
  "splashScreen": {
    "duration": 2000,
    "backgroundColor": "#ffffff"
  }
}

With Custom Image Styling

{
  "splashScreen": {
    "duration": 2000,
    "backgroundColor": "#1a1a1a",
    "imageWidth": 150,
    "imageHeight": 150,
    "cornerRadius": 75
  }
}

Auto-Dismiss (iOS Only)

{
  "splashScreen": {
    "backgroundColor": "#ffffff"
  }
}

Omitting duration on iOS auto-dismisses when WebView loads

Best Practices

Duration Recommendations

• Fast apps (< 1s): Use auto-dismiss on iOS, or 1000ms on Android
• Medium apps (1-3s): Set duration to 2000-3000ms
• Slow apps (> 3s): Use auto-dismiss on iOS, or 3000ms on Android

Image Guidelines

• Format: PNG recommended (JPG, WebP also supported on Android)
• Size: 512x512px recommended
• File size: Keep under 1MB
• Circular icons: Set cornerRadius to half of image width/height