Nets Design logo and other specific symbols

Status Bars

The status bar appears along the upper edge of the screen and displays useful information about the device’s current state, like the time, cellular carrier, network status, and battery level. The actual information shown in the status bar varies depending on the device and system configuration.

Use the system-provided status bar. People expect the status bar to be consistent systemwide. Don’t replace it with a custom status bar.

Guidelines

Coordinate the status bar style with your app design. Use a dark status bar works on light-colored content and a light status bar on dark-colored content.

Obscure content under the status bar. Keep the status bar readable and don’t imply that content behind it is interactive. There are several common techniques for doing this:

  • Use a navigation bar in your app, which automatically displays a status bar background and ensures that content doesn’t appear under the status bar.
  • Display a custom image, like a gradient or solid color, behind the status bar.
  • Place a blurred view behind the status bar.

Temporarily hide the status bar when displaying full-screen media. A status bar can be distracting when users are trying to focus on media.

  • Nets Status Bars image
  • Nets Status Bars image
  • Nets Status Bars image
  • Nets Status Bars image