Mobile information button UI examples

Information button UI examples

• See the flow
  Pick Up Limes↗

  At the top, a date selector displays 'Fri 07 Jun '24' flanked by navigation arrows, with a calendar icon on the left and an info icon on the right.

• See the flow
  VSCO: Photo & Video Editor↗

  At the top of the screen, there is a header with a close 'X' icon and the title 'Simplify' accompanied by an information icon.

• See the flow
  FLYP - Fashion Design Studio↗

  The layout features a top navigation bar with a close button and an information icon, followed by a tabbed interface switching between 'Assistant' and 'Learning' (currently selected).

• See the flow
  BuyBye - Budget Planner↗

  An information icon is placed next to the investment return rate field.

• See the flow
  Plane Finder ⁃ Flight Tracker↗

  The layout is a vertical list with a clean, white background, utilizing a standard navigation bar at the top with a 'Back' button and an information icon.

• See the flow
  Fishbrain - Fishing App↗

  The main content area provides two summary cards: 'Season' (marked as 'Open') and 'Aggregate limit' (set to '10'), both including info icons.

• See the flow
  The Guardian - US & World News↗

  Below this, a secondary toolbar shows a menu icon, a timer (00:10), a user profile icon, a hint icon with a dropdown, an info icon, and a settings gear.

• See the flow
  Gaia GPS: Mobile Trail Maps↗

  Top data dashboard, central map view with floating controls, bottom navigation bar.

• See the flow
  Everlook- Face & Body Editor↗

  At the very bottom, a navigation bar contains a cancel 'X' button on the left, a centered label 'Acne' with a help/info icon, and a checkmark 'confirm' button on the right.

• See the flow
  ThemeKit: Widget & Icon Themes↗

  At the top, a navigation bar includes a close button, a help icon, the title 'Install Themes', and a currency balance display showing 120 diamonds.

• See the flow
  Zalando – Online fashion↗

  The main content area is titled 'Outfit inspiration' with a subtitle 'How to style the latest looks' and an info icon.

• See the flow
  Deezer: Music Player, Podcast↗

  At the top, there is a close button on the left, the artist name 'Kendrick Lamar' and song title 'squabble up' in the center, and a report/info icon on the right.

• See the flow
  Too Good To Go: Save Good Food↗

  At the top, a navigation bar includes a back arrow and an information icon.

• See the flow
  Vivino: Drink The Right Wine↗

  The top of the screen includes a close button on the left, an information icon in the center, and a black circular button on the right.

• See the flow
  Useless - Screen Time Control↗

  A 'Limits' card indicates 'No limits set' with an information icon.

• See the flow
  Blinq: Digital Business Card↗

  At the bottom, there is a feedback prompt 'Did you find this summary helpful?' accompanied by a thumbs-up and a thumbs-down icon button for user interaction.

• See the flow
  Calculator₊↗

  At the bottom, there is a small information icon with the text 'Can always change themes later.' and a large, prominent blue 'Continue' button at the bottom of the screen.

• See the flow
  Map My Run GPS Running Tracker↗

  Header with back button and title, followed by workout metadata, a large pace chart, summary metrics, and a bottom information button.

• See the flow
  Precip - Rain Totals & Gauge↗

  Each layer has a corresponding icon on the left and a help/info icon on the right.

• See the flow
  Tattoo AI - Tattoo Design↗

  At the top, there is a 'Close' (X) button on the left, a centered 'AR Preview' title, and an 'Info' button on the right.