Speedtest by Ookla

Colors

• #090d1cBackdrop Dim · scrim_background
• #191e32Sheet Dark Navy · modal_surface
• #00a5f0Email Button Cyan · action_primary
• #000000Apple Button Black · action_apple
• #ffffffGoogle Button White · action_google
• #ffffffText White · primary_text · apple_text
• #111111Text Black · google_text
• #828ca3Text Dim Slate · secondary_text · list_icons
• #2d344dDivider Gray · divider_line

Type

• banner_descriptionSF Pro Text · 36px · 400 · #ffffff
• button_labelSF Pro Text · 36px · 500 · #ffffff
• divider_labelSF Pro Text · 28px · 500 · #828ca3
• disclaimer_textSF Pro Text · 32px · 400 · #828ca3
• text_linkSF Pro Text · 34px · 400 · #00a5f0
• list_item_labelSF Pro Text · 36px · 400 · #ffffff

Elements

• Close Modal Button · icon_button

  Top right corner of sheet (~50px from right margin) · Simple white 'X' icon glyph

• Sign in with Email · button

  Full width inside card padding (~1000x120px) · Solid vivid cyan pill button with white envelope icon and white label

• Sign in with Apple · button

  Full width below 'OR' separator, ~1000x120px · Solid black pill button with Apple logo icon and white label

• Sign in with Google · button

  Full width below Apple button, ~1000x120px · Solid white pill button with multi-color G glyph and dark grey text

• Navigation Menu List · list

  Vertical list below authentication section with divider lines · Icon + title + right chevron rows: Results, Settings, About Privacy & Terms, Support

Layout

Modal sheet presenting authentication options on top with legal terms followed by global settings and navigation options.

Notes

Modal displays standard iOS third-party authentication buttons conforming to Apple and Google design guidelines.