UFC

Colors

• #000000Background Black · screen background
• #121212Surface Dark Gray · list item background · dialog background
• #FFFFFFText White · primary titles · settings labels
• #888888Text Muted Gray · descriptions · secondary labels
• #CC0000Primary Red · active switches · active buttons
• #000000Dialog Overlay Dim · modal backdrop dimming

Type

• TitleSF Pro Text · 14px · bold · #FFFFFF
• BodySF Pro Text · 14px · regular · #FFFFFF
• Dialog TitleSF Pro Display · 18px · semibold · #000000

Elements

• Preferences Header · Header

  Centered at top with a back arrow on left · Plain black background with white text

• Confirmation Dialog · Modal Dialog

  Centered overlay with rounded corners · White rounded card with dark text and a split action button at bottom

Layout

Vertical scrollable settings list with a centered modal confirmation dialog appearing above the content.

Notes

Screenshot includes an iOS style confirmation popup overlay regarding language change.