WebToAppMaker

App Configuration

Style Customization

Configure status bar treatment, app background, orientation, fullscreen mode, and light/dark appearance.

Before you start

  • Brand colors with accessible contrast
  • A decision about portrait, landscape, or automatic rotation

Configure and verify

  1. Choose status bar colors

    Set light and dark backgrounds, then select dark icons for light backgrounds or light icons for dark backgrounds.

  2. Set the app background

    Choose the color shown behind the WebView and native surfaces. Use valid six-digit hexadecimal colors.

  3. Choose orientation

    Allow both orientations, lock portrait, or lock landscape based on the website layout.

  4. Choose fullscreen

    Fullscreen hides system bars. Test forms, dialogs, and navigation gestures before enabling it.

  5. Preview both themes

    Use Light and Dark in the side preview, save, and rebuild to apply native system-bar changes.

Status bar and App Bar

The App Bar can follow Style Customization, blend behind the status bar, or use a classic protected layout. Check both pages together.

Android edge-to-edge

Modern Android versions can enforce edge-to-edge layouts. Test the generated APK on Android 15 and an older supported device.

Color format

Valid
#FFFFFF, #186E62
Avoid
Named colors, gradients, or incomplete values

Test before release

  • Status icons have contrast
  • Web content stays clear of controls
  • Orientation matches the product
  • Both themes are readable