Wispr Flow: AI Voice Keyboard

Colors

• #000000Modal Overlay Dim · scrim backdrop overlay
• #F2F2F7Alert Surface Glass · system alert card background
• #000000Alert Primary Text · alert title · action button text
• #3C3C43Alert Subtitle Gray · alert description text
• #D1D1D6Button Capsule Fill · alert action button capsule surface

Type

• alert_titleSF Pro Text · 40px · 600 · #000000
• alert_bodySF Pro Text · 34px · normal · #3C3C43
• alert_buttonSF Pro Text · 38px · 600 · #000000

Elements

• Background Scrim · overlay

  Fills entire viewport behind modal dialog. · Semi-transparent black backdrop blur dimming the underlying Screen 2 UI.

• iOS System Auth Dialog · modal_dialog

  Horizontally and vertically centered, ~920px wide by 520px tall. · Translucent frosted material with rounded corners, subtle white border stroke and soft outer drop shadow.

• Cancel Action Button · button

  Bottom-left within alert container, ~400px wide by 120px tall. · Capsule shape with light gray translucent fill and bold dark text.

• Continue Action Button · button

  Bottom-right within alert container, ~400px wide by 120px tall. · Capsule shape with light gray translucent fill and bold dark text.

Layout

Standard modal interruption layer centered over dimmed login interface, prompting for ASWebAuthenticationSession / domain sign-in permissions.

Notes

Appearance matches iOS 17/18 system-level authentication permission dialog.