TV Remote & Universal Control™

Colors

• #202124Screen Background · primary background
• #27292dCard Surface · grouped section cards · promo card background
• #383a3fCard Border · promo card border outline · row dividers
• #ffffffPrimary Text · headers · primary row labels
• #8c9099Secondary Text · section titles · tab bar inactive labels · card subtitle
• #3755ecAccent Brand Blue · active tab icon/label · upgrade button text · row icon fills
• #34c759Toggle Active Green · switch track fill when enabled
• #f59e0bPromo Star Accent · promo illustration background circle · star icon

Type

• Screen TitleSF Pro Display · 44px · 700 · #ffffff
• Banner HeadingSF Pro Text · 38px · 700 · #ffffff
• Banner SubtitleSF Pro Text · 28px · 400 · #8c9099
• Section HeaderSF Pro Text · 34px · 500 · #8c9099
• List Row LabelSF Pro Text · 38px · 400 · #ffffff
• Button TextSF Pro Text · 34px · 600 · #3755ec
• Tab Bar LabelSF Pro Text · 24px · 500 · #8c9099

Elements

• Premium Banner · card

  Centered horizontally, margin around 48px from left and right, directly below the screen title · Dark charcoal rounded container (#27292d) with 1.5px subtle border (#383a3f), containing an orange star badge, promo copy, and an upgrade button

• Upgrade Button · button

  Vertically centered inside right portion of Premium Banner, pill-shaped · Solid white pill background with blue text label

• Settings Section Groups · container

  Stacked vertically with section headers above each card group: General, Support, Privacy · Dark rounded rectangle cards with subtle horizontal divider lines between items

• Toggle Switch · switch

  Right-aligned within the list rows in the General group · Vibrant green rounded pill track with a circular white thumb indicator in the active position

• Row Disclosure Indicator · icon

  Right-aligned chevron icon inside list items in Support and Privacy sections · Thin stroke right-facing chevron in semi-transparent light gray

• Bottom Navigation Bar · tab_bar

  Fixed to bottom of screen across full width, housing four navigation destinations · Semi-opaque dark background with faint top border; icons stacked vertically over small text labels

Layout

Single-column scrollable settings page anchored by a centered top title, a prominent subscription callout banner, followed by three grouped settings cards, and anchored at the bottom by a four-tab navigation bar.

Notes

Font estimates assume standard iOS system typography (SF Pro) given system UI elements like toggles and status indicators. The floating top browser/island bar indicates screen capture within an embedded web view or app wrapper.