Grok Bot

Colors

• #FFFFFFpage-bg · screen background · button surface
• #111111text-primary · headline · button labels · signup callout
• #666666text-muted · labels · legal notices · footer link
• #E5E5E5border-light · pill button outlines

Type

• titleSF Pro Display · 44px · 600 · #111111
• buttonSF Pro Text · 30px · 500 · #111111
• bodySF Pro Text · 26px · 400 · #666666
• caption-legalSF Pro Text · 24px · 400 · #737373

Elements

• xai-header-group · header

  Horizontal row under browser nav bar with logo on left, dropdown on right. · xAI stylized typography mark next to 'You are signing into' text and rounded border dropdown.

• social-login-stack · stack

  Vertical column of 4 rounded pill buttons centered horizontally, ~980 px wide, ~110 px tall. · Thin border stroke (#E5E5E5), white background, leading brand icons.

• signup-prompt · text_link

  Centered below buttons stack, ~40 px margin top. · Gray leading copy with bold black inline link 'Sign up'.

• footer-terms · footer

  Positioned above bottom browser bar, centered multi-line text. · Underlined anchor links for Terms of Service, Privacy Policy, and Your privacy choices.

Layout

Clean linear layout: brand identity header, title, primary authentication buttons, account switch prompt, and legal footer.

Notes

Identity page for x.ai OAuth flow without the cookie banner overlay shown in Screen 1.