Grok Bot

Colors

• #FFFFFFpage-bg · screen background · card surface
• #EDEDEDcard-border · border of setting card
• #0D7F58toggle-green · switch active background
• #111111button-black · continue button fill
• #111111text-dark · title · setting title · continue label
• #555555text-secondary · subtitle · body explanation · footer links

Type

• titleSF Pro Display · 34px · 600 · #111111
• subtitleSF Pro Text · 26px · 400 · #555555
• card-headingSF Pro Text · 30px · 600 · #111111
• card-bodySF Pro Text · 26px · 400 · #444444
• buttonSF Pro Text · 26px · 600 · #FFFFFF

Elements

• data-sharing-card · card

  Centered block, width ~92% (~990 px), height ~420 px. · White fill, rounded rectangle with thin border (#EDEDED), padded inner content.

• share-data-switch · toggle_switch

  Top right within data sharing card, ~100x60 px. · Rounded pill switch filled with forest green (#0D7F58) and white round thumb knob.

• continue-button · button

  Centered horizontally below card, width ~440 px, height ~86 px. · Solid black fill (#111111) with rounded corners and white text.

• footer-links · text_link

  Centered below continue button, ~40 px margin top. · Gray body text with underlined Privacy Policy and Security anchors.

Layout

Onboarding consent screen with top header text, isolated consent preference card with switch, primary Continue action, and footer legal references.

Notes

Hosted under cursor.com webview domain. Switch color appears slightly darker than standard iOS green.